我的英语水平很低,因为我来自韩国。然后,我需要您的帮助..我正在研究React-native(android),我想切换屏幕...但是React导航不起作用。我找到这个解决方案了1天...但是我找不到解决方案...请帮助我。
HomePage.js
import React, { Component } from 'react';
import { TouchableOpacity,StyleSheet, Text, View, Image } from 'react-native';
class HomeScreen extends React.Component {
render() {
return (
<View style={styles.MasterContainer}>
<NavBar/>
<UserBar/>
<View style={{height: 40,}}></View>
<ButtonTab/>
<Admob/>
<TapBar/>
</View>
);
}
}
class NavBar extends React.Component {
render(){
const {navigation} = this.props;
return(
<View style={styles.NavBar}>
<TouchableOpacity>
<Text style={{fontWeight: 'bold',fontSize: 18, color: 'white'}} onPress ={() =>
navigation.navigate('NavPg')}>더보기</Text>
</TouchableOpacity>
</View>
)
}
}
App.js
import React from 'react';
import HomePage from './screens/HomeScreen';
import NavPage from './screens'
import {createAppContainer} from 'react-navigation';
import {createStackNavigator} from 'react-navigation-stack';
const App = createStackNavigator(
{
Home: {screen:HomePage},
NavPg: {screen:NavPage},
},
{initialRouteName:"Home", headerMode:'none'}
);
export default createAppContainer(App);
您可以从下面的代码使用react-navigation使用withNavigaion的HOC,希望它能工作
import { withNavigation } from 'react-navigation';
class NavBar extends React.Component {
render(){
const {navigation} = this.props;
return(
<View style={styles.NavBar}>
<TouchableOpacity>
<Text style={{fontWeight: 'bold',fontSize: 18, color: 'white'}} onPress ={() =>
navigation.navigate('NavPg')}>더보기</Text>
</TouchableOpacity>
</View>
)
}
}
export default withNavigation(NavBar);
您可以检查我的新问题吗?