rt2zz / redux-persist

persist and rehydrate a redux store
MIT License
12.94k stars 866 forks source link

Redux Persist renders a white screen instead of SplashScreen #1433

Open ilyadynin opened 1 year ago

ilyadynin commented 1 year ago

`const App: React.FC = () => { useEffect(() => { //useEffect stuff }, [])

const CustomLoadingScreen = () => {

console.log('Rendering')

return (
  <View style={{
    flex: 1,
    alignItems: 'center',
    justifyContent: 'center',
  }}>
    <Text style={{
      fontSize: 20,
      color: 'black',
      fontWeight: 'bold',
    }}>Loading...</Text>
  </View>
);

};`

` return ( <>

} persistor={persistor}>
</>

); };`

So I integrated redux persist and overall it works completely fine in my project, but when it comes to loading the App we have an issue. Instead of showing a Loading screen, it shows a completely blank screen for 1-1,5 seconds.

In my project I use expo and also SplashScreen.preventAutoHideAsync(); provided by Expo to show an initial SplashScreen, and I would like to keep it there until everything loads or better said also when the PersistGate is loading, but I didn't find away how to achieve this. And the issue here is that now I am trying to pass a CustomLoadingScreen component to loading, but it is still white and there is a white 1 sec delay on my Android phone at least between the expo SplashScreen, the white screen caused by PersistGate and my app being loaded.