React native 反应本机-刷新屏幕

我有以下应用程序：

主->登录->收藏夹

在主屏幕上，您可以单击名为“收藏夹”的按钮，该按钮：

1） 如果您已登录，它将显示您的收藏夹

2） 如果您未登录，它将显示登录屏幕

假设有人未登录并登录到应用程序，此集合是API中的一个密钥，并返回一个警报，提示“您现在已登录…”

登录后返回主屏幕时，如果他们单击“收藏夹”，仍将显示登录屏幕。他们必须关闭应用程序并重新启动应用程序，才能使登录生效

确保他们不必继续登录的最佳方式是什么

以下是主文件：

  renderView() {


    if(this.state.token != null)
    {
        var data = this.getData();
    }else{
        console.log("token " + this.state.token);
        this.refs.nav.navigator.push({
          title: "Login",
          component: Login,
          rightButtonTitle: 'Cancel',
          passProps: {nav: navigator},
          onRightButtonPress: () => { this.refs.nav.navigator.pop(); }
        });
    }

  }


render() {
    return (

      <NavigatorIOS
          ref="nav"
          style={styles.container}
          initialRoute={{
              title: 'Home',
              component: Main,
              rightButtonTitle: this.renderIcon(),
              onRightButtonPress: () => {
                  this.renderView();
              }

          }} />

    );

  }

getData() {

  var query = urlForQueryAndPage('token', this.state.token, 1);

  fetch(query)
    .then(response => response.json())
    .then(json => this._handleResponse(json.response))
    .catch(error =>
      this.setState({
        isLoading: false,
        message: 'Something bad happened ' + error
    }));
}

如您所见，登录只会弹出一个窗口。但我需要以某种方式刷新主屏幕，以确保在用户无需重新登录的情况下显示收藏夹。

避免在登录后重新登录

---

如果您可以以持久方式而不是以易失性状态保存令牌，那么您可以检索该值，并在第一次获取该值后进行检查

在我看来，我有两种方法可以持久保存令牌

首先，检查您的令牌是否存在于异步存储中

及

您可以从redux persist持久化的redux存储中检索令牌，但是如果您想要理解和实现redux，那么这可能会很耗时，但这是值得的

---

在您的

main.js

文件中，您是否获取了令牌并执行了

this.setState（{token}）在
组件上将挂载
循环？@tushar Khat-嗨，不，我只是在controller@TusharKhatiwada嘿，我的回复给你了吗？谢谢，我使用异步存储，谢谢，没有问题。问题是，我从主屏幕开始，使用存储设置令牌，然后返回主屏幕后，它仍然会说我在重置应用程序之前没有登录？如果你需要重置应用程序，只得到你需要的，那么这意味着，你触发函数的方式，以设置放置在错误位置的令牌状态，因此，它仅在应用程序重新启动时触发。你需要找到循环功能，即使你从其他页面导航时也会触发？所以你的问题是在用户登录并返回主页后，令牌没有更新，但需要重新启动应用程序来更新它？检查我更新的答案？它能解决你的问题吗？
    handleLogin(reply) {

      if(reply.body.response == 'true')
      {
          this.setServerKey(reply.body.key);
          AlertIOS.alert(
              "Login",
              "You are now signed in. Please go back to access your favourites!"
          );
      }else{

        AlertIOS.alert(
            "Login",
            "Wrong username/password. Please try again!"
        );

      }

  }

let token;

constructor(props) {
  super(props);
  this.checkToken();
}

async checkToken() {
  try {
    const value = await AsyncStorage.getItem('@MySuperStore:token');
    if (value !== null){
      token = value;
    } 
  } catch (error) {
    // Error getItem from AsyncStorage
  }
}

renderView() {
  if(token != null) {
    var data = this.getData();
  } else {
    //re-check because constructor only run once
    this.checkToken();
    if (token) {
      We have data!! therefore we getData() and redirect to favourites page
    } else {
      this.refs.nav.navigator.push({
        title: "Login",
        component: Login,
        rightButtonTitle: 'Cancel',
        passProps: {nav: navigator},
        onRightButtonPress: () => { this.refs.nav.navigator.pop(); }
      });
    }
  }
}

try {
  const value = await AsyncStorage.getItem('@MySuperStore:token');
  if (value !== null){
    // We have data!! therefore we redirect to favourites page
  } else {
    // call getData() and handleLogin()
    // remember setItem token to AsyncStorage
    await AsyncStorage.setItem('@MySuperStore:key', token);
  }
} catch (error) {
  // Error retrieving data or setItem to AsyncStorage
}