如何在 createMaterialTopTabNavigator React-navigation v4 上启用惰性功能？

Question

在react-navigation v3中，

createMaterialTopTabNavigator

有

lazy

选项，在react-navigation v4上，它仍然可用，但不起作用，根据github帐户上的这个reply，似乎它只能再次起作用在反应导航 v5 上。 现在有人如何在react-navigation-tabs上启用延迟加载吗？

const CTabs = createMaterialTopTabNavigator(BTabs, {
  // Default config for all screens',
  initialRouteName: AScreen',
  tabBarComponent: Header,
  swipeEnabled: false,
  lazy: true,
  backBehavior: 'initialRoute',
});

package.json

 "react-native": "0.60.4",
 "react": "16.8.6",
 "react-native-reanimated": "1.2.0",
 "react-native-gesture-handler": "1.4.1",
 "react-navigation": "4.0.5",    
 "react-navigation-tabs": "2.5.3",
 "react-native-screens": "^2.0.0-alpha.3",

Answer 1

使用此链接我在那里编写了完整的代码

  lazy={true}
  optimizationsEnabled={true}
  tabBarOptions={tabBarOptions}

Answer 2

在我使用

"@react-navigation/material-top-tabs": "^6.2.1"

的版本中，懒惰标志被移到了

deprecated

区域，但是当我把它放在那里时，向后导航时显示白屏的问题得到了解决。

代码片段：

import { createMaterialTopTabNavigator } from '@react-navigation/material-top-tabs';

const Tab = createMaterialTopTabNavigator();

//Just add the 'lazy:true' to the 'screenOptions' property
<Tab.Navigator screenOptions={{ lazy: true }} tabBar={(props) => <Tabs {...props} />}>

{/* ... */}

</Tab.Navigator>