Reactjs React Native-如何在React navigation中的StackNavigator之间传递道具?
我正在使用React导航文档中描述的身份验证流: 所以基本上,我有这样一个SwitchNavigator:Reactjs React Native-如何在React navigation中的StackNavigator之间传递道具?,reactjs,react-native,react-navigation,Reactjs,React Native,React Navigation,我正在使用React导航文档中描述的身份验证流: 所以基本上,我有这样一个SwitchNavigator: import { createSwitchNavigator, createStackNavigator } from 'react-navigation'; // Implementation of HomeScreen, OtherScreen, SignInScreen, AuthLoadingScreen // goes here. const AppStack = creat
import { createSwitchNavigator, createStackNavigator } from 'react-navigation';
// Implementation of HomeScreen, OtherScreen, SignInScreen, AuthLoadingScreen
// goes here.
const AppStack = createStackNavigator({ Home: HomeScreen, Other: OtherScreen });
const AuthStack = createStackNavigator({ SignIn: SignInScreen });
export default createSwitchNavigator(
{
AuthLoading: AuthLoadingScreen,
App: AppStack,
Auth: AuthStack,
},
{
initialRouteName: 'AuthLoading',
}
);
在SignInScreen中,用户登录后,我使用以下命令导航到主屏幕:
this.props.navigation.navigate('App', { myData: 'myData' });
如何在主屏幕中获取
myData
this.props.navigation.state.params在我的情况下为空。如果params未定义,则需要使用
this.props.navigation.state.getParam('myData','defaultValue'))
您可以在中看到,在将参数传递给stacknavigator时,是否有人仍然获得空值,这是因为您无法直接将参数传递给stacknavigator。在传递参数时,它会混淆堆栈中引用的屏幕。
如果要将参数传递到堆栈内部的路由,请直接导航到该路由。
对于OP问题,有一个解决方法
this.props.navigation.navigate('Home', { myData: 'myData' });
<>但是它不是传递道具的好方法,我宁可考虑使用ReDux来管理整个应用程序的状态
有关更详细的解释,请查看github问题getParam('myData')也为空。我想这是因为我想导航的App
屏幕是StackNavigator,而不是屏幕。因此参数被传递给createStackNavigator。我不知道如何在主屏幕上显示。我也有同样的问题。你是怎么修好的?