Question

React Native 导航中的参数传递

2019-02-14

5599

reactjs react-native react-navigation

我是 react-native 和 react-navigation 的新手。如何在导航器之间传递参数？即从

NavigatorA to the another screen of NavigatorB

传递一些参数，请参阅下面的导航器设置。

    const MobileNumberEntryStack = StackNavigator({
    MobileNumberEntry: MobileNumberEntryScreen
});

const AuthStack = StackNavigator({
    SignIn: SignInScreen,
    SignUp: SignUpScreen
});

const AppNavigator = SwitchNavigator({
    Loading: LoadingScreen,
    App: TabNavigator,
    Auth: AuthStack,
    MobileNumberEntryStack: MobileNumberEntryStack,
});

export default AppNavigator;

在我的 LoadingScreen 中，我正在获取一些数据，然后从那里切换到 MobileNumberEntryStack ，方法是调用

`this.props.navigation.navigate('MobileNumberEntryStack', { user` })

但我在 MobileNumberEntryScreen 中没有获取用户。有人可以帮我吗？

Answer 1

将以下代码添加到 AppNavigator 中，然后尝试导航到其中。

 MobileNumberEntryStack: {
        screen: MobileNumberEntryStack,
    },

Answer 2

您可以使用 this.props.navigation.navigate('ScreenName', {user}) 访问您发送的变量，像这样 this.props.navigation.state.params.user 这样就可以了。

Answer 3

您可以使用此代码从 NavigatorA 发送参数：

this.props.navigation.navigate('Details', {
   itemId: 86,
   otherParam: 'anything you want here',
});

并使用此代码在 NavigatorB 中接收参数：

const { navigation } = this.props;
const itemId = navigation.getParam('itemId', 'NO-ID');
const otherParam = navigation.getParam('otherParam', 'some default value');