在React Navigation v5动态组件配置中将道具传递给组件

时间:2020-02-10 17:37:40

标签: react-native react-navigation

在我的应用中,如果用户未登录,则显示登录屏幕,如果用户已登录,则显示登录屏幕。在下面的简单示例中,您可以看到我正在检查{ {1}}和jwt存在于我的redux存储中,然后显示适当的屏幕。

user

如果存在type Props = { +jwt: string | null; +user: UserModel | null; }; export class AuthStackNavigator extends Component<Props> { renderScreen() { if (this.props.jwt && this.props.user) { return ( <Stack.Screen name={'AuthenticatedView'} component={AuthenticatedView} /> ); } else { return ( <Stack.Screen name={'LoginView'} component={LoginView} /> ); } } render() { return ( <Stack.Navigator> {this.renderScreen()} </Stack.Navigator> ); } } const mapStateToProps = (state) => { return { jwt: getJwt(state), user: getUser(state) }; }; export default connect(mapStateToProps)(AuthStackNavigator); AuthenticatedView,则可以看到jwt组件已呈现。在user内部,我目前再次从redux存储中获取AuthenticatedView,该位置可能为空-这涉及另一项检查。我知道有一种方法可以将useruser作为组件传递给组件吗?这样,我不必多次进行相同的检查。

我知道您可以在使用<Stack.Screen>进行导航时将数据发送到组件,但是我不能使用此功能导航到该屏幕。

1 个答案:

答案 0 :(得分:2)