Как сохранить идентификатор пользователя и пароль с токеном JWT через асинхронное хранилище в React-Native

Question

Я новичок в реакции-нативной. Я просто хочу создать функцию входа в систему с помощью JSON API и сохранить токен JWT для идентификатора пользователя, и мое приложение может войти в систему, но проблема в том, что при выходе из приложение после входа в систему, я получаю затем войдите снова. Я отправляю экран Authloading и login в моем вопросе. Пожалуйста, проверьте мой полный код. Вот мой начальный экран.

class AuthLoadingScreen extends Component {
 constructor(props) {
 super(props);
 this.loadData();
  }
 render() {
  return (
  <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center', }}>
    <ActivityIndicator />
    <StatusBar barStyle="default" />
  </View>
  );
 }
  loadData = async () => {         
 const isLoggedIn = await AsyncStorage.getItem('isLoggedIn')        
this.props.navigation.navigate(isLoggedIn != 'null' ? 'loginnavigator' : 'drawernavigator') }
 }

Это мой экран входа в систему

 class Login extends Component {
  constructor(props) {
   super(props);
   this.state = {
  TextInputEmail: '',
  TextInputPassword: '',
  };
 }

 CheckTextInput = async () => {
  console.log(this.state.TextInputEmail);
   let pattern = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;
   if (this.state.TextInputEmail != '') {
   if (this.state.TextInputPassword != '') {
    if(pattern.test(this.state.TextInputEmail) === true){

        await fetch('http://104.197.28.169:3000/auth/login?', {
          method: 'POST',
          headers: {
           'Accept': 'application/json',
           'Content-Type': 'application/json',
         },
         body: JSON.stringify({
           email: this.state.TextInputEmail,
           password: this.state.TextInputPassword,

         })          
       }).then((response) => response.json())
            .then((responseJson) => {
              if(responseJson.message === "user logged in successfully")
               {
                   alert('User login Successfully')
                   console.log('Token' , responseJson.token)

              AsyncStorage.setItem('isLoggedIn',responseJson.token);
                  this.props.navigation.navigate('drawernavigator');           
               }
               else{
                            alert(responseJson.message);
              }

             }).done()
    } else {
      alert('Invalid email Address')
    }
  }
  else alert('Please Enter Password');

 } else alert('Please Enter Email & Password');
};


 const LoginNavgation = createStackNavigator(
 { screen : Login, },
 {
 defaultNavigationOptions: {
  header: null,
 }
},
);
const mydrawer = createStackNavigator(
{ app: AppContainer },
{
defaultNavigationOptions: {
  header: null,
}
});

Это мой код навигации.

  export default createAppContainer(createSwitchNavigator(
 {
  AuthLoading: AuthLoadingScreen,
  loginnavigator: LoginNavgation ,
  drawernavigator: mydrawer,
 },
));

Answer 1

То, что вы делаете неправильно, это:

this.props.navigation.navigate(isLoggedIn != 'null' ? 'loginnavigator' : 'drawernavigator') }

Здесь вы получите токен в isLogged, который будет не равен нулю, и если он не равен нулю, вам нужно показать навигатор ящика.

ДЕЛАЙТЕ это:

this.props.navigation.navigate(isLoggedIn != 'null' ? 'drawernavigator' : 'loginnavigator') }

Надеюсь, это поможет!