react-native tab navigator lazy load

Question

I am using tab navigator on app but when it loads it all runs at same time. I want to run as seperate like when i click on one tab then it call componentWillMount.

Lazy load not working

const HomeNavigator = TabNavigator(  {
Component1: {
  screen: Component1
},
Component2: {
  screen: Component2
},
Component3: {
  screen: Component3
}},{
tabBarPosition: "bottom",
lazy: true,
tabBarOptions: {
  activeTintColor: "#e91e63"
},
initialRouteName: "Account",
tabBarComponent: props => {
  return <UserFooter navigation={props.navigation} />;
}  });

Version "react": "16.2.0", "react-native": "0.52.0",

Answer 1

React navigation has dropped this feature since v1.0.0-beta23.

The discussion is here ... https://github.com/react-navigation/react-navigation/pull/3064

So, if you need to make the lazy feature work, you have to use an old version.