React Native: пользовательский заголовок не настроен на навигацию заголовка - PullRequest
0 голосов
/ 11 января 2020

Я создал топ-навигатор в своем android реактивном родном проекте:

const topSurvayorsNavigator = createMaterialTopTabNavigator({
    ActiveSurveyor: {
        screen: MomayezanScreen,
        params: { status: 1 },
        navigationOptions: {
            tabBarLabel: <Text style={{ fontSize: 12, fontFamily: 'IranianSans' }}>ممیزان فعال</Text>,
            tabBarIcon: (tabInfo => {
                return (
                    <Icon name="stars" size={15} color={tabInfo.tintColor} />
                );
            })
        },
    },
    DeActiveSurveyor: {
        screen: MomayezanScreen,
        params: { status: 0 },
        navigationOptions: {
            tabBarLabel: <Text style={{ fontSize: 12, fontFamily: 'IranianSans' }}>ممیزان غیرفعال</Text>,
            tabBarIcon: (tabInfo => {
                return (
                    <Icon name="md-stars" size={15} color={tabInfo.tintColor} />
                );
            })
        },

    }
}, {
    swipeEnabled: true,
    tabBarOptions: {
        labelStyle: {
            fontSize: 12
        },
        activeTintColor: Colors.darkGray
    }
});

После этого я добавил topSurvayorsNavigator в навигатор основного стека:

const AuditMomayezanNavigator = createStackNavigator({
    Dashboard: DashboardScreen,
    ListSurveyor: {
        screen: topSurvayorsNavigator,
    },
    Detail: SurveyorDetailsScreen,
}, {
    defaultNavigationOptions: defaultNavOptions
});

и наконец:

export default createAppContainer(AuditMomayezanNavigator);

В MomayezanScreen в соответствии с параметрами я загружал разные данные в плоский список. На странице я хочу установить пользовательский заголовок, поэтому я делаю это:

MomayezanScreen.navigationOptions = ({ navigation }) => {
    const statusId = navigation.getParam('status');
    console.log(statusId);
    return {
        header: () => <CustomHeader
            title={`ممیزان ${statusId === 0 ? 'غیر فعال' : 'فعال'}`} />
    }
} 

Но, к сожалению, ничего не изменилось, и заголовок не имеет никакого заголовка.

enter image description here

На самом деле заголовок Кустома не установлен в компоненте заголовка !!! Какова ваша идея?

Я изменил MomayezanScreen.navigationOptions на это:

MomayezanScreen.navigationOptions = ({ navigation }) => {
    const statusId = navigation.getParam('status');
    console.log(statusId);
    return {
        headerTitle: `test`
    }
}

Но все равно ничего не напечатано в заголовке.

1 Ответ

0 голосов
/ 12 января 2020

Вы устанавливаете заголовок в MomayezanScreen, который находится внутри createMaterialTopTabNavigator. Вы можете установить заголовок только на экране, который находится внутри createStackNavigator.

. Это подробно объясняется в документах React Navigation: https://reactnavigation.org/docs/en/navigation-options-resolution.html

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...