Quantcast
Channel: Active questions tagged react-native+typescript - Stack Overflow
Viewing all articles
Browse latest Browse all 6291

React Native BottomTabs navigator not lazy loading initial screen

$
0
0

I just added Suspense to my BottomTabNavigator in my React Native app. The problem is that the first screen (HomeScreen) is not displaying - all others do. I see just white background when I navigate to Home Screen.

Here's what my code looks like:

const HomeScreen = lazy(() => import('../screens/HomeScreen'));const ExploreScreen = lazy(() => import('../screens/ExploreScreen'));const BlogScreen = lazy(() => import('../screens/BlogScreen'));const BottomTabs = createBottomTabNavigator();const BottomTabNavigator = () => {  return (<Suspense      fallback={<View><Text style={{ color: 'red' }}>Loading screen...</Text></View>      }><BottomTabs.Navigator        initialRouteName="Home"        screenOptions={{        ...      }}><BottomTabs.Screen          name="Home"          component={HomeScreen}          options={{            title: 'Home',            tabBarLabel: 'Home',            ...          }}        /><BottomTabs.Screen          name="Explore"          component={ExploreScreen}          options={{            title: 'Explore',            tabBarLabel: 'Explore',            ...          }}        /><BottomTabs.Screen          name="Blog"          component={ScheduleScreen}          options={{            title: 'Blog',            tabBarLabel: 'Blog',            ...          }}        /></BottomTabs.Navigator></Suspense>  );};

Any ideas?


Viewing all articles
Browse latest Browse all 6291

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>