Question

假设我有两个子组件，Login和Profile。默认情况下，通过导航器

呈现登录

<Navigator initialRoute={{name: 'login'}} renderScene={this.renderScene} />

继承我的renderScene方法

renderScene(route) {
    switch (route) {
        case 'login':
            return <Login / >;

        case 'profile':
            return <Profile / >;
    }
}

因此，当有人通过Login登录时，状态会更新，并且所有内容（包含导航器的主应用程序容器）都会重新呈现。那么我何时何地将Profile路径推送到导航器？

我是否根据renderScene方法中的状态更改初始路由？

或者我在重新渲染后推新路线？

或者我应该使用shouldComponentUpdate而不是重新渲染，而是将新路由推送到导航，具体取决于状态。

Answer 1

您可以使用Redux的强大功能并维护经过身份验证的会话的状态，如此

const initialState = { session: { isAuthenticated: getToken() ? true : false } }

此处getToken可以是获取访问令牌的方法。通常，当服务器对登录进行身份验证并将响应成功时，将其存储在本地存储中。

由于您已使用[connect()][1]将组件连接到商店，因此您现在可以访问状态this.props，现在可以在renderScene方法中执行以下操作。< / p>

renderScene(route, navigator) { const { session } = this.props route = session.isAuthenticated ? { id: 'login' } : { id: 'profile' } switch (route.id) { case 'login': // Return the login component case 'profile': // Return the profile component default: // Return default component } }

有了这个，你不必真正推动，因为状态改变会触发重新渲染。您可以根据需要在此处添加更多逻辑，但希望这可以帮助您入门，如果您还没有想到这一点。

根据Redux中的状态更新Navigator组件

1 个答案: