Question

在我的本机应用程序中，我将用户信息安全地保存在密钥链上，以便在他们登录一次后，我保存信息，然后在用户下次访问时，信息已经存在，因此用户不需要登录。

问题是我在componentDidMount中进行检查，然后如果用户之前从未登录过或在上次访问时退出，我会将它们重定向到loginScreen，如下所示：

componentDidMount() {
    //Need to check if they've signed in before by checking the USER_INFO.
    SecureStore.getItemAsync("USER_INFO").then(response => {
        //Have they signed in before?
        if (response !== undefined) {
          //yes.
          //continue with app stuff.
        }
        else {
          //Not logged in before need to go to login.
          const resetAction = NavigationActions.reset({
            index: 0,
            actions: [
              NavigationActions.navigate({ routeName: 'Login', params: this.props.navigation.state.params }),
            ]
          });
          this.props.navigation.dispatch(resetAction);

        }
    });

}

问题是我收到警告'警告：只能更新已安装或安装的组件。这通常意味着您在已卸载的组件上调用了setState，replaceState或forceUpdate。这是一个无操作。'。这是有道理的，因为我在屏幕渲染之前重定向，但问题是，我应该在哪里执行这些检查？

由于

Answer 1

我看到你正在使用react-navigation。我做了同样的事情，你试图以不同的方式完成。

为了简化我在导航器中有三个屏幕

// Navigator.js
export const RootNavigator = StackNavigator({
  Splash: { screen: SplashView },
  Login: { screen: LoginView },
  RootDrawer: { screen: RootDrawer }
}, {
  headerMode: 'none',
  initialRouteName: 'Splash'
});

然后在我的SplashView（这是我的起点）中，我在其构造函数中验证用户。虽然它正在验证用户，但SplashView只是渲染一个文字，上面写着＆＃34; Splash Screen＆＃34;但显然可以是任何东西。

constructor(props) {
    super(props);

    this.authenticateSession();
}

authenticateSession() {
    const { navigation } = this.props;
    dispatch(storeGetAccount())
      .then(() => {
        navigation.dispatch(navigateToAccountView(true));
      })
      .catch(() => {
        navigation.dispatch(navigateToLoginView());
      });
}

函数navigateToAccountView() and navigateToLoginView()只是我可以在其他地方使用它们，但navigateToLoginView()看起来像这样

export function navigateToLoginView() {
  return NavigationActions.reset({
    index: 0,
    key: null,
    actions: [
      NavigationActions.navigate({ routeName: 'Login' })
    ]
  });
}

Answer 2

通常并且据我所知，处理这种检查的最佳方法是将组件包装成一些HOC (High Order Component)在那里做你的逻辑，并且如果用户通过检查，你可以抛出一个重定向到登录页面或加载用户数据并继续呈现组件。

这是一个很好的做法，因此您可以创建一个>>> df['unique_count'] = df.groupby(['a','b','c']).transform('count')['d'] >>> df a b c d e unique_count 0 3 4 1 3 0 3 1 3 1 4 3 0 2 2 4 3 3 2 1 1 3 3 4 1 4 0 3 4 0 4 3 3 2 2 5 1 2 0 4 1 1 6 3 1 4 2 1 2 7 0 4 3 4 0 2 8 1 3 0 1 1 1 9 3 4 1 2 1 3 HOC，它将包装只有经过身份验证的用户才能访问的组件或应用程序部分。而且你将拥有一个高度可重用的组件。

因此，您将导出受保护的组件＆＃34;像这样：

withAuth()

在export default withAuth(myComponent) HOC而不是在您的组件中执行逻辑。

检查用户是否在响应本机之前登录

2 个答案: