stacknavigator反应顶部菜单的本机设置标题

问题描述

我有一个这样创建的菜单：

Locale currentLocale = Locale.getDefault();
System.out.println(currentLocale.getdisplayLanguage());
System.out.println(currentLocale.getdisplayCountry());

System.out.println(currentLocale.getLanguage());
System.out.println(currentLocale.getCountry());

System.out.println(System.getProperty("user.country"));
System.out.println(System.getProperty("user.language"));

使用StackNavTitle：

import {createStackNavigator} from 'react-navigation';

   const stackNav = createStackNavigator({
    Main: {
   screen: JourneeService,navigationoptions: ({navigation}) => ({
     headerTitle: <StackNavTitle title="Journée de Service " />,headerStyle: {
    backgroundColor: '#0088CE',},headerTintColor: '#fff',headerTitleStyle: {
       fontWeight: 'bold',headerLeft: (
    <TouchableOpacity
      onPress={() => navigation.openDrawer()}
      style={{width: '150%'}}>
      <Icon name="ios-menu" size={35} color="#fff" style={{padding: 10}} />
    </TouchableOpacity>
  ),}),}

在代码上我通过回调检索标题，我想动态设置标题，我该怎么做？

提前感谢您的答复

解决方法

您可以为标题提供一个函数，该函数根据文档接受三个参数，其中一个包含动态标题。这是我从文档中获取的示例，并使用您的标头组件进行更新

import {createStackNavigator} from 'react-navigation';

   const stackNav = createStackNavigator({
    Main: {
   screen: JourneeService,navigationOptions: ({navigation}) => ({
     headerTitle: ({allowFontScaling,style,children})=> <StackNavTitle title={children.title} />,headerStyle: {
    backgroundColor: '#0088CE',},headerTintColor: '#fff',headerTitleStyle: {
       fontWeight: 'bold',headerLeft: (
    <TouchableOpacity
      onPress={() => navigation.openDrawer()}
      style={{width: '150%'}}>
      <Icon name="ios-menu" size={35} color="#fff" style={{padding: 10}} />
    </TouchableOpacity>
  ),}),}

您可以在这里https://reactnavigation.org/docs/4.x/stack-navigator#headertitle

找到更多信息