Navigation 主屏包含四个Tab,这四个Tab会在刚进App的时候全部开始加载,怎么解决



  • const MainPage = TabNavigator({
        homework_index: {
            screen: HomeworkIndex,
            navigationOptions: {
                tabBarLabel: '作业',
                tabBarIcon: ({focused}) => {
                    return(<Icon size={26} style={styles.icon_style} name={focused ? 'ios-home' : 'ios-home-outline'} />)
                }
            }
        },
    
        notification_index: {
            screen: NotificationIndex,
            navigationOptions: {
                tabBarLabel: '通知',
                tabBarIcon: ({focused}) => {
                    return(<Icon size={26} style={styles.icon_style} name={focused ? 'ios-albums' : 'ios-albums-outline'} />)
                }
            }
        },
    
        self_learning_index: {
            screen: SelfLearningIndex,
            navigationOptions: {
                tabBarLabel: '自学',
                tabBarIcon: ({focused}) => {
                    return(<Icon size={26} style={styles.icon_style} name={focused ? 'ios-brush' : 'ios-brush-outline'} />)
                }
            }
        },
    
        personal_index: {
            screen: PersonalIndex,
            navigationOptions: {
                tabBarLabel: '我的',
                tabBarIcon: ({focused}) => {
                    return(<Icon size={26} style={styles.icon_style} name={focused ? 'ios-contact' : 'ios-contact-outline'} />)
                }
            }
        }
        }, {
            tabBarPosition: 'bottom',
            animationEnabled: false,
            //tabBarComponent: TabBar,
            tabBarOptions: {
                activeTintColor: '#642100',
                showIcon: true,
                labelStyle: {
                    fontSize: 10,
                    marginTop: 0,
                    marginBottom: 2,
                    color: 'gray'
                    //paddingTop: 10
                },
                style: {
                    height: 50,
                    backgroundColor: 'white'
                },
                tabStyle: {
                    marginTop: 0
                },
                indicatorStyle: {
                    height: 0
                }
            }
        }
    
    )
    
    const AppNavigation = StackNavigator({
        main_page: {
            screen: MainPage,
        },
    ...
    
    export default AppNavigation
    
    

    怎么解决



  • 看官方文档,配置项里有 lazy属性,可以用于懒加载