Загрузить дом после входа в систему Вызов был успешным

Question

Я реализовал страницу входа в систему и сервис входа в систему для своего собственного приложения реакции. Теперь я хочу загрузить домашний экран, когда вход был успешным. Я могу сделать это с помощью this.props.navigation.navigate / .push ("home"), но я всегда могу вернуться оттуда на страницу входа. Как я могу загрузить экран в качестве отправной точки?

Спасибо, Ян

Answer 1

На странице, где указан экран приветствия, используйте значения локального хранилища для извлечения сохраненных данных и сравните значения для установки экрана приветствия.

Пример

const screenData = AsyncStorage.getItem("startScreen");
const stackScreen = createStackNavigator(
  {
    home: {
      screen: homeScreen
    },
    login: {
      screen: LoginScreen
    },
  }
  {
   initialRouteName: screenData === "loginsucess" ? "home" : "login"
   }

Answer 2

Способ навигации выглядит нормально, но на вашем месте я бы создал отдельные навигаторы стека для страниц входа и домашней страницы.

Если вы используете реагирующую навигацию, естьболее простой способ сделать это представлен в новых API.

import { createAppContainer, createSwitchNavigator } from 'react-navigation';
import { createStackNavigator } from 'react-navigation-stack';

export default createAppContainer(
createSwitchNavigator(
{
  AuthLoading: AuthLoadingScreen,
  App: "Your homepage screen",
  Auth: "Your login screen",
},
{
  initialRouteName: 'AuthLoading',
}
)
);

и в AuthLoadingScreen проверяют токен, который определяет, вошел ли пользователь в систему следующим образом

class AuthLoadingScreen extends React.Component {
componentDidMount() {
this._bootstrapAsync();
}

// Fetch the token from storage then navigate to our appropriate place
_bootstrapAsync = async () => {
const userToken = await AsyncStorage.getItem('userToken');

// This will switch to the App screen or Auth screen and this loading
// screen will be unmounted and thrown away.
this.props.navigation.navigate(userToken ? 'App' : 'Auth');
};

// Render any loading content that you like here
render() {
return (
  <View>
    <ActivityIndicator />
    <StatusBar barStyle="default" />
  </View>
);
}
}