1.react-native init ReactNavigation
2.yarn add react-navigation
3.react-native run-android
这样如下图就说明运行成功了，当然这里你如果有使用模拟器或者真机并开启调试模式，则会自动安装并运行App
4.新建App.js文件，并在index.android.js中引入
5.App.js中引入navigation ，并使用
import {
StackNavigator,
} from 'react-navigation';
const App = StackNavigator({
ReactNavigation:{screen:ReactNavigation},
Main: {screen: MainScreen},
Profile: {screen: ProfileScreen},
});
6.我们新建两个界面，分别是MainScreen和ProfileScreen
如何实现跳转？
非常简单
const { navigate } = this.props.navigation;
navigate('Main');
如何传参？
const { navigate } = this.props.navigation;
navigate('Main',{userName:'linjian',age:28});
如何接受参数？
const { params } = this.props.navigation.state;
let userName = params.userName;
let age = params.age;
跳到MainScreen如何回传参数到ReactNavigation?
setUserName(userName){
this.setState({userName:userName})
}
goToNext(){
const { navigate } = this.props.navigation;
navigate('Main',{userName:this.state.userName,age:28,setUserName:this.setUserName.bind(this)});
}
MainScreen 里面
static navigationOptions = ({ navigation }) => ({ title:{`Chat with ${navigation.state.params.userName}`}, headerRight:{navigation.state.params.setUserName('huanglimei')}} />,
});
英文文档：请点击这里
