Как получить доступ к данным из другого маршрута, отображая при этом заставку в react-native / expo?

Я изучаю React Native / Expo, поэтому этот вопрос может показаться глупым. Я пытаюсь загрузить данные со страницы (в данном случае inbox.js) через страницу контекста, а затем, если данные загружены или нет, я показываю заставку или страницу inbox.js.

Я пытался передать usestate в false, когда все загружается в контекст, а затем проверить это в моем app.js

Затем в моем inbox.js

и в контексте

Спасибо

const Stack = createNativeStackNavigator();


function AppNavigator() {

  const { isLoadingContextOne ,setIsLoadingContextOne }  = useContext(LoadingContextApp);

  

 
  if (isLoadingContextOne) {
    return <SplashScreens />;
  }
  
 const{isLoggedIn,isLoadingContext,loadAsyncData,setIsLoggedIn,setIsLogoutLoading,isLogoutLoading} = useContext(AuthContext);



  
  return (
    <Stack.Navigator screenOptions={{ headerShown: false, animation: 'none' }}>
      {isLoggedIn ? (
        <>
        
          <Stack.Screen name="inbox" component={Test} options={{ title: 'inbox Page' }} />
        </>
      ) : (
        <>
          <Stack.Screen name="auth" component={Splash} options={{ title: 'auth Page' }} />
          <Stack.Screen name="Login" component={LoginPage} options={{ title: 'Login Page' }} />
          <Stack.Screen name="Register" component={RegisterPage} options={{ title: 'Register Page' }} />
        </>
      )}
    </Stack.Navigator>
  );
}




export default function App({navigation}) {

  const [IsReady, SetIsReady] = useState(false);
  

  const loadFontsAsync = async () => {
    await Font.loadAsync({
      test: require('./fonts/Unbounded-Bold.ttf'),
      
      
    });
  };
  

  if (!IsReady) {
    return (
      <AppLoading
        startAsync={loadFontsAsync}
        onFinish={() => SetIsReady(true)}
        onError={() => {}}
      />
    );
  }
  

  return (
    <GestureHandlerRootView style={{ flex: 1 }}>
      <NotifierWrapper>
      <LoadingProvider>
        <AuthProvider>
          
          <NavigationContainer>
            <AppNavigator />
            <Toast ref={(ref) => Toast.setRef(ref)} />
          </NavigationContainer>
        </AuthProvider>
          </LoadingProvider>

      </NotifierWrapper>
    </GestureHandlerRootView>
  );
}









useEffect(() => {
    if (
      !loadingInfoDeLuser &&
      !isLoading &&
      !isLoadingmessage &&
 
    ) {
     
      setIsLoadingContextOne(false); // This will remove the splash screen when all conditions are met
      
    }
  }, [
    loadingInfoDeLuser,
    isLoading,
    isLoadingmessage,
   
  ]);
import React, { useContext, createContext, useState, useEffect } from 'react';
import AsyncStorage from '@react-native-async-storage/async-storage';
import { useNavigation } from '@react-navigation/native';
import SplashScreens from './splashFinal';

const LoadingContextApp = createContext();

export const LoadingProvider = ({ children }) => {
  const [isLoadingContextOne, setIsLoadingContextOne] = useState(true);
  

  const setLoaded = () => {
    setIsLoadingContextOne(false);
  };


  
  

  return (
    <LoadingContextApp.Provider value={{ isLoadingContextOne,  setIsLoadingContextOne }}>
      {children}
    </LoadingContextApp.Provider>
  );
};

export default LoadingContextApp;
Амос
Вопрос задан3 февраля 2024 г.

1 Ответ

2
Виктор
Ответ получен7 сентября 2024 г.

Ваш ответ

Загрузить файл.