javascript - 在 DrawerNavigator 中使用屏幕选项传递 Prop

Question

我在 https://reactnavigation.org/docs/navigators/drawer 中使用 DrawerNavigator .

const MyApp = DrawerNavigator({
    Home: {
        screen: MyHomeScreen,
    },
    Notifications: {
        screen: MyNotificationsScreen,
    },
});

我有多个屏幕使用具有不同属性的 MyNotificationsScreen 组件。

我该如何做:

const MyApp = DrawerNavigator({
    Home: {
        screen: MyHomeScreen,
    },
    Notifications1: {
        screen: MyNotificationsScreen(propName=val1),
    },
    Notifications2: {
        screen: MyNotificationsScreen(propName=val2),
    },
});

Answer 1

我认为在很多情况下更好的方法:

screen: (props) => <MyNotificationsScreen {...props} propName={val1} />

这会将您的导航 Prop 放入 props.navigation.state.params 中。如果你想让它们出现在 this.props 中(这意味着你的组件没有与 react-navigation 紧密耦合)那么使用:

screen: (props) => <MyNotificationsScreen {...props.navigation.state.params} propName={val1} />