重新加载时反应本机路径通量组路径重置

时间:2018-07-05 19:39:15

标签: react-native react-native-router-flux

我创建了一个简单的应用程序,该应用程序可以让用户登录并将api令牌保存在asyncstorage中,现在,当用户通过身份验证时,路由更改为“欢迎”屏幕。这可以。现在的问题是,当我重新加载该应用程序时,该应用程序将返回到其本地路由,并且即使已通过验证,模拟器的“后退”按钮也会返回到登录页面。

我需要一些指导来做什么。

import React, { Component } from "react";
import { StyleSheet, AsyncStorage } from "react-native";
import { Scene, Router, Actions } from "react-native-router-flux";
import HomeScreen from "./components/HomeScreen";
import LoginForm from "./components/LoginForm";
import { connect } from "react-redux";
import { initApp } from "./actions";
import RegistrationScreen from "./components/RegistrationScreen";
import ProfileScreen from "./components/ProfileScreen";
import MenuBarScreen from "./components/MenuBarScreen";
import I18n from "./i18n";
import axios from "axios";
class Routes extends Component {
  constructor() {
    super();
    this.initApp = this.initApp.bind(this);
  }

  initApp = async () => {
    I18n.initAsync();

    let userToken = await AsyncStorage.getItem("token");
    let userAuthStatus = await AsyncStorage.getItem("userAuthStatus");

    console.log("token alreaday stored : ", userToken);
    console.log("status already set : ", userAuthStatus);

    if (userAuthStatus === null) {
      console.log("Writing data!");
      let tmpToken = "";

      await fetch("http://e53a6273.ngrok.io/api/v1/me")
        .then(response => response.json())
        .then(data => {
          tmpToken = data.tmpToken;
          this.props.initApp(false);
          console.log("server tmpToken : " + data.tmpToken);
          console.log(
            "app Status when user is not loggedin : " + this.props.appIsready
          );
        })
        .catch(error => {});

      userToken = await AsyncStorage.setItem("token", tmpToken);
      userAuthStatus = await AsyncStorage.setItem("userAuthStatus", null);

      console.log("New token  " + userToken);
      console.log("New userAuthStatus  " + userAuthStatus);
    } else {
      let config = {
        headers: { "Content-Type": "application/json" }
      };
      await axios
        .post(
          `http://e53a6273.ngrok.io/api/v1/authenticateWithToken/${userToken}`,
          { userToken: userToken },
          config
        )
        .then(response => {
          if (response.status >= 200 && response.status < 300) {
            console.log("server status " + response.data.authenticationStatus);
            this.props.initApp(response.data.authenticationStatus);
          }
          
        })
        .catch(error => {
          console.log(error);
        });
    }
  };

  
  componentWillMount() {
    this.initApp();
  }

  render() {
    console.log(
      "route is mounted and initial app status is  : " + this.props.appIsready
    );
    return (
      <Router navigationBarStyle={styles.navBar} titleStyle={styles.navTitle}>
        <Scene key="root" hideNavBar>
          <Scene key="auth" initial={this.props.appIsready ? false : true}>
            <Scene
              key="home"
              component={HomeScreen}
              title="MAZHR"
              
            />

            <Scene key="login" component={LoginForm} title="Login" />

            <Scene
              key="register"
              component={RegistrationScreen}
              title="Register"
            />
          </Scene>

          <Scene key="authenticatedScene" initial={this.props.appIsready ? true : false}>
            <Scene
              rightTitle="Menu"
              onRight={() => {
                Actions.menuBar();
              }}
              key="userProfile"
              component={ProfileScreen}
              title="profile"
              
            />
          </Scene>

          <Scene key="menuBar" component={MenuBarScreen} title="" hideNavBar />
        </Scene>
      </Router>
    );
  }
}

const styles = StyleSheet.create({
  navBar: {
    backgroundColor: "#1F5F5A"
  },
  navTitle: {
    color: "#fff"
  }
});
const mapStateToProps = ({ authReducer }) => {
  const { appIsready } = authReducer;
  return {
    appIsready
  };
};
export default connect(
  mapStateToProps,
  { initApp }
)(Routes);

0 个答案:

没有答案