转载来自React Navigation(需要科学上网)：https://reactnavigation.org/docs/navigators/navigation-prop
------------------------------------------------------------------------------------------------------
第二次编辑补充：
React Navigation: NavigationActions中的back方法的用法，举例：栈中有A/B/C/D四个页面，栈顶是D，从D直接跳转到A， 那么需要在B加载的时候就记下B的key，通过this.props.navigation.state.key得到，记录在一个全局变量中, 然后this.props.navigation.dispatch(NavigationActions.back({key: '记录在全局变量中的那个key'}));
-------------------------------------------------------------------------------------------------------
Screen Navigation Prop:
Each screen in your app will receive a navigation prop which contain the following: 1. navigate - (helper) link to other screens 2. state - screen's current state/routes 3. setParams - (helper) make changes to route's params 4. goBack - (helper) close active screen and move back 5. dispatch - send an action to router 详细介绍： 1. navigate - Link to other screens Call this to link to another screen in your app. Takes the following arguments: navigate(routeName, params, action) routeName - A destination routeName that has been registered somewhere in the app's router params - Params to merge into the destination route action - (advanced) The sub-action to run in the child router, if the screen is a navigator. See Actions Doc for a full list of supported actions. class HomeScreen extends React.Component { render() { const {navigate} = this.props.navigation; return ( <View> <Text>This is the home screen of the app</Text> <Button onPress={() => navigate('Profile', {name: 'Brent'})} title="Go to Brent's profile" /> </View> ) } } 2. state - The screen's current state/route A screen has access to its route via this.props.navigation.state. Each will return an object with the following: { // the name of the route config in the router routeName: 'profile', //a unique identifier used to sort routes key: 'main0', //an optional object of string options for this screen params: { hello: 'world' } } class ProfileScreen extends React.Component { render() { const {state} = this.props.navigation; // state.routeName === 'Profile' return ( <Text>Name: {state.params.name}</Text> ); } } 3. setParams - Make changes to route params Firing the setParams action allows a screen to change the params in the route, which is useful for updating the header buttons and title. class ProfileScreen extends React.Component { render() { const {setParams} = this.props.navigation; return ( <Button onPress={() => setParams({name: 'Lucy'})} title="Set title name to 'Lucy'" /> ) } } 4. goBack - Close the active screen and move back Optionally provide a key, which specifies the route to go back from. By default, goBack will close the route that it is called from. If the goal is to go back anywhere, without specifying what is getting closed, call .goBack(null); class HomeScreen extends React.Component { render() { const {goBack} = this.props.navigation; return ( <View> <Button onPress={() => goBack()} title="Go back from this HomeScreen" /> <Button onPress={() => goBack(null)} title="Go back anywhere" /> <Button onPress={() => goBack('screen-123')} title="Go back from screen-123" /> </View> ) } } 5. dispatch - Send an action to the router Use dispatch to send any navigation action to the router. The other navigation functions use dispatch behind the scenes. Note that if you want to dispatch react-navigation actions you should use the action creators provided in this library. See Navigation Actions Docs for a full list of available actions. import { NavigationActions } from 'react-navigation' const navigateAction = NavigationActions.navigate({ routeName: 'Profile', params: {}, // navigate can have a nested navigate action that will be run inside the child router action: NavigationActions.navigate({ routeName: 'SubProfileRoute'}) }) this.props.navigation.dispatch(navigateAction) Navigation Actions All Navigation Actions return an object that can be sent to the router using navigation.dispatch() method. Note that if you want to dispatch react-navigation actions you should use the action creators provided in this library. The following actions are supported: 1. Navigate - Navigate to another route 2. Reset - Replace current state with a new state 3. Back - Go back to previous state 4. Set Params - Set Params for given route 5. Init - Used to initialize first state if state is undefined 1. Navigate The Navigate action will update the current state with the result of a Navigate action. routeName - String - Required - A destination routeName that has been registered somewhere in the app's router params - Object - Optional - Params to merge into the destination route action - Object - Optional - (advanced) The sub-action to run in the child router, if the screen is a navigator. Any one of the actions described in this doc can be set as a sub-action. import { NavigationActions } from 'react-navigation' const navigateAction = NavigationActions.navigate({ routeName: 'Profile', params: {}, action: NavigationActions.navigate({ routeName: 'SubProfileRoute'}) }) this.props.navigation.dispatch(navigateAction) 2. Reset The Reset action wipes the whole navigation state and replaces it with the result of several actions. index - number - required - Index of the active route on routes array in navigation state. actions - array - required - Array of Navigation Actions that will replace the navigation state. import { NavigationActions } from 'react-navigation' const resetAction = NavigationActions.reset({ index: 0, actions: [ NavigationActions.navigate({ routeName: 'Profile'}) ] }) this.props.navigation.dispatch(resetAction) How to use the index parameter The index param is used to specify the current active route. eg: given a basic stack navigation with two routes Profile and Settings. To reset the state to a point where the active screen was Settings but have it stacked on top of a Profile screen, you would do the following: import { NavigationActions } from 'react-navigation' // reset方法的奥义 const resetAction = NavigationActions.reset({ index: 1, actions: [ NavigationActions.navigate({ routeName: 'Profile'}), NavigationActions.navigate({ routeName: 'Settings'}) ] }) this.props.navigation.dispatch(resetAction) 3. Back Go back to previous screen and close current screen. back action creator takes in one optional parameter: key - string or null - optional - If set, navigation will go back from the given key. If null, navigation will go back anywhere. import { NavigationActions } from 'react-navigation' const backAction = NavigationActions.back({ key: 'Profile' }) this.props.navigation.dispatch(backAction) 4. SetParams When dispatching SetParams, the router will produce a new state that has changed the params of a particular route, as identified by the key params - object - required - New params to be merged into existing route params key - string - required - Route key that should get the new params import { NavigationActions } from 'react-navigation' const setParamsAction = NavigationActions.setParams({ params: { title: 'Hello' }, key: 'screen-123', })this.props.navigation.dispatch(setParamsAction)
