Adn*_*Ali 2 javascript reactjs react-router react-native react-navigation
嗨,我是新来的反应原生,我面临奇怪的路由问题.我做错了但需要有人来指导我.
index.android.js
import { LandingScreen } from './src/components/landing_screen.js'
import HomeScreen from './src/app_component.js'
import { StackNavigator } from 'react-navigation';
const SimpleApp = StackNavigator({
Home: { screen: HomeScreen },
Landing: { screen: LandingScreen},
});
AppRegistry.registerComponent('HomeScreen', () => SimpleApp);
Run Code Online (Sandbox Code Playgroud)
app_component.js
// Other imports ...
export default class HomeScreen extends Component {
static navigationOptions = {
title: 'Home Screen',
};
render() {
const { navigate } = this.props.navigation;
return (
<View style={styles.container}>
<Text style={styles.welcome}>
Welcome to React Native!
</Text>
<Text style={styles.instructions}> Hello CHannoo!!!</Text>
<Text style={styles.instructions}>
To get started, edit index.android.js
</Text>
<Text style={styles.instructions}>
Double tap R on your keyboard to reload,{'\n'}
Shake or press menu button for dev menu
</Text>
<Button
title="Go to 2nd Page"
onPress={() =>
// alert('hello');
navigate('LandingScreen')
// navigate('Home', { name: 'Jane' })
}
/>
</View>
);
}
componentDidMount () {
SplashScreen.close({
animationType: SplashScreen.animationType.scale,
duration: 850,
delay: 500,
})
}
}
Run Code Online (Sandbox Code Playgroud)
landing_screen.js
export default class LandingScreen extends Component {
static navigationOptions = {
title: 'Landing Screen Title',
};
render() {
return (........)
}
Run Code Online (Sandbox Code Playgroud)
如果我们删除路线着陆,它工作正常.但是当我们添加这条路线时,我们会收到错误
Route'Landing'应该声明一个屏幕.例如 ......
您的LandingScreen已导出为,default但您按名称导入它.
你的import语句是这样的:
import { LandingScreen } from './src/components/landing_screen.js'
Run Code Online (Sandbox Code Playgroud)
用下面的行替换它(没有花括号):
import LandingScreen from './src/components/landing_screen.js'
Run Code Online (Sandbox Code Playgroud)
它应该解决问题.
但是你可能会得到一个新错误,因为@Medet指出,因为你必须改变这一行:
navigate('LandingScreen')
Run Code Online (Sandbox Code Playgroud)
至:
navigate('Landing')
Run Code Online (Sandbox Code Playgroud)
因为您的屏幕名称是登陆.
| 归档时间: |
|
| 查看次数: |
1225 次 |
| 最近记录: |