2-4 关于 react-navigation 组件 页跳转问题:
来源:4-4 项目启动引导流程实现
22不小了
2017-05-21

/**
* Sample React Native App
* https://github.com/facebook/react-native
* @flow
*/
import React, { Component } from 'react';
import {
AppRegistry,
StyleSheet,
Text,
View,
Image,
ListView,
TouchableOpacity,
RefreshControl,
Button
} from 'react-native';
import { StackNavigator } from 'react-navigation';
import WelcomePage from './WelcomePage';
export default class Setup extends Component {
constructor(props) {
super(props);
this.onLoad();
}
onLoad(){
setTimeout(()=>{
this.setState({isLoading:false})
},2000);
}
static navigationOptions = {
title: 'Welcome',
};
render() {
const { navigate } = this.props.navigation;
return ( <View>
<Text>Hello, Chat App!</Text>
<Button
onPress={() => navigate('Chat')}
title="Chat with Lucy"
/>
</View>);
}
}
const SimpleApp = StackNavigator({
Home: { screen: Setup },
Chat: { screen: WelcomePage },
});
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: 'white',
},
row:{
height:70
},
tips:{
fontSize:18
},
line:{
height:1,
backgroundColor:'black'
}
});
AppRegistry.registerComponent('simple_app', () => simple_app);还请老师帮忙分析一下,我这个是什么问题,我照着官方文档的例子模仿写了一个,由于英语水平问题,可能是那些地方没有领会,还请老师指点
写回答
3回答
-
错误信息是:
const { navigate } = this.props.navigation;
this.props.navigation 为 undefined.
你这个本身就是根组件,怎么会有this.props.navigation这个属性呢?
this.props.navigation 应该是父组件,就是调用这个组件的时候传递过来的属性。
还有你的 `index.android.js`这个文件需要导入 `import Setup from './js/page/Setup` 这个文件的。
然后Setup这个文件最后一行不需要,重复注册了。
建议你先去看看react的基础知识,先把react的基本语法熟悉一下。。
012017-06-06 -
tomatoCoder
2017-05-27
AppRegistry.registerComponent('simple_app', () => simple_app);
AppRegistry.registerComponent('simple_app', () => Setup); 入口用了两次?
10 -
22不小了
提问者
2017-05-21
问题补充:
index.android.js
/** * Sample React Native App * https://github.com/facebook/react-native * @flow */ import React, {Component} from 'react'; import { AppRegistry, } from 'react-native'; AppRegistry.registerComponent('simple_app', () => Setup); 我是从这个页面进入上面的Setup.js 文件的00
相似问题