Блог

Главная - Вопросы по программированию - Заставка приложения для Android не загружается мгновенно — React Native

Заставка приложения для Android не загружается мгновенно — React Native

#android #react-native

Вопрос:

Я относительно новичок в родной реакции, и я пытался написать этот код, в котором я получаю тип пользователя (т. е. Администратор или Мод) из своей базы данных и переключаюсь на соответствующий навигатор ящиков. В промежутках между переключениями я загружаю заставку. Моя проблема в том, что, скажем, я вхожу в систему как администратор, затем выхожу из системы и пытаюсь войти в систему как мод, за долю секунды до загрузки заставки отображается мой предыдущий экран (т. е. экран администратора). Любая помощь будет очень признательна.

 const App = () => {
  const [isLoading, setIsLoading] = useState(true);
  const [userType, setUserType] = useState(null);
  const [User, setUser] = useState(null);

  const getUserType = async () => {
    //Getting UserType from Database
    setUserType(fetchedUserType);
  };

  const onAuthStateChanged = user => {
    setUser(user);
    setTimeout(() => {
      if (isLoading) setIsLoading(false);
    }, 2000);
  };

  useEffect(() => {
    const subscriber = auth().onAuthStateChanged(onAuthStateChanged);
    return subscriber;
  });

  useEffect(() => {
    //clearing the UserType and making the splash screen render
    setUserType(null);
    setIsLoading(true);
    let Mounted = true;
    getUserType().then(() => {
      if (Mounted) {
        setIsLoading(false);
      }
      return function cleanup() {
        Mounted = false;
      };
    });
  }, [User]);

  if (isLoading) {
    return <Splash></Splash>;
  } else if (User === null) {
    return <Login></Login>;
  } else if (userType === 'Admin') {
    return <AdminDrawerNavigator></AdminDrawerNavigator>;
  } else if (userType === 'Mod') {
    return <ModDrawerNavigator></ModDrawerNavigator>;
  } else {
    return <Fatal></Fatal>;
  }
};

Ответ №1:

Попробуйте добавить в рендеринг:

 if(userType===null){
    return null;
}
if (isLoading) {
    return <Splash></Splash>;
} else if (User === null) {
   return <Login></Login>;
} else if (userType === 'Admin') {
    return <AdminDrawerNavigator></AdminDrawerNavigator>;
} else if (userType === 'Mod') {
    return <ModDrawerNavigator></ModDrawerNavigator>;
} else {
    return <Fatal></Fatal>;
}

Комментарии:

1. Это, похоже, не работает, потому что изначально тип пользователя имеет значение null, поэтому программа просто показывает пустой экран

Ответ №2:

Удалось устранить эту проблему, удалив эффект setUserType(null) второго использования.

Метки: