React-Navigation导航(页面跳转)

http://www.jianshu.com/p/4d14bd41dff3

1.首先添加react-navigation

在项目的命令窗口

npm install --save react-navigation
2.导入stack导航组件
//导入stack导航组件
import { StackNavigator } from 'react-navigation';
3.进行导航的注册
//进行导航的注册
const HelloRN = StackNavigator(
    {Home: { screen: HomeScreen },
});

AppRegistry.registerComponent('HelloRN', () => HelloRN);

//在导航中显示的标题内容

 static navigationOptions = {
    title: 'Welcome',
};   
4.添加一个新画面
class SecondScreen extends React.Component {
static navigationOptions = {
title: 'SecondScreen',
};
render() {
return (
  
    SecondScreen
  
);
}
}
5.进行注册
const SimpleApp = StackNavigator({
 Home: { screen: HomeScreen },
  Second: { screen: SecondScreen },//新添加的screen
});
6.添加一个Button
render之后

   const {navigate} = this.props.navigation;

    retrun之前

   

你可能感兴趣的:(ReactNative)