Реагируйте на встроенную навигацию - поместите параметры навигации стекового навигатора в навигатор по нижней части

Question

Как сказано в документации createBottomTabNavigator , экраны внутри навигатора могут содержать переменную с именем navigationOptions, в которой они настраивают различные параметры.Я сделал это успешно с моими собственными компонентами, однако, когда я попытался поместить Stack Navigator в Навигатор Bottom Tab, и с этим я столкнулся с проблемой.

ПРОБЛЕМА: Я не уверен, куда поместить переменную navigationOptions при создании стекового навигатора для настройки tabIcon навигатора нижних вкладок, соответствующего этому стековому навигатору Iсоздал.

Я попробовал это: (фрагмент кода # 1)

const navigator = createStackNavigator(
    {
        'MainKYCScreen': {
            screen: KYCScreen
        }
    },
    {
    initialRouteName: "MainKYCScreen"
    },
);

const AppContainer = createAppContainer(navigator);

// navigationOptions - start
AppContainer.navigationOptions = {
    tabBarIcon: ({ focused }) => (
        <NavButtonContainer focused={focused}>
            <KYCIcon status={KYCIcon.TYPE_RED} />
        </NavButtonContainer>
    )
};
// navigationOptions - end

export default AppContainer;

И это: (фрагмент кода # 2)

const navigator = createStackNavigator(
    {
        'MainKYCScreen': {
            screen: KYCScreen
        }
    },
    {
        initialRouteName: "MainKYCScreen"
    },
);

const AppContainer = createAppContainer(navigator);

export default class KYCNavigator extends AppContainer {
    // navigationOptions - start
    static navigationOptions = {
        tabBarIcon: ({ focused }) => (
            <NavButtonContainer focused={focused}>
                <KYCIcon status={KYCIcon.TYPE_RED} />
            </NavButtonContainer>
        )
    }
    // navigationOptions - end
}

Удаление кода из navigationOptions - start до navigationOptions - end.Похоже, что это выдает странную ошибку.

Может кто-нибудь мне помочь?

Answer 1

Что касается вашей ошибки, просто импортируйте React из пакета «activ».

import React, {Component} from 'react' 

Для объяснения, почему он должен быть импортирован, я думаю, этот может объяснить, почему.