Не удается отобразить пользовательский заголовок в tabNavigator - PullRequest
Новая
       2

Не удается отобразить пользовательский заголовок в tabNavigator

1 голос
/ 03 марта 2020

Я не могу показать свой пользовательский заголовок с параметрами навигации * stati c. Это только TabNavigator в моем названии. Что мне делать?

Это мой компонент HomeScreen; 

export default class Home extends Component {
  static navigationOptions = ({navigation}) => ({
    title: 'MENEMENOYS',
    headerLeft : (
      <TouchableOpacity
      onPress={() => {
          AuthStore.LogOut().then(() => {
              navigation.navigate('LoginPage');
          });

      }}>
      <Icon
          name="md-log-out"
          size={30}
          color={'white'}
          style={{marginLeft:10}}
      />
  </TouchableOpacity>
    )
  })

А это мой роутер: стековый навигатор с навигатором вкладок. 

const TabNavigator = createBottomTabNavigator(
  {
    Home: {
      screen: Home,
      navigationOptions: {
        tabBarIcon: ({ tintColor }) => (
          <Icon
            name="md-home"
            size={30}
            color={tintColor}
            style={styles.homeIcon}
          />
        ),
      },
    },
    AddNewCar: {
      screen: AddNewCar,
      navigationOptions: {
        tabBarIcon: ({ tintColor }) => (
          <Icon
            name="md-add-circle"
            size={40}
            color={tintColor}
            style={styles.addIcon}
          />
        ),
      },
    },
    OtoparkList: {
      screen: OtoparkList,
      navigationOptions: {
        tabBarIcon: ({ tintColor }) => (
          <IconAwesome name="car" size={30} color={tintColor} />
        ),
      },
    },
  },
  {
    tabBarOptions: {
      showLabel: false,
      activeTintColor: '#41AB5F',
      inactiveTintColor: 'white',
      style: {
        backgroundColor: '#1F202D',
        borderTopColor: 'transparent',
      },
    },
  },
);

const AppNavigator = createStackNavigator(
  {
    TabNavigator: {
      screen: TabNavigator,
      navigationOptions: {
        
      }
    },
    LoginPage: {
      screen: LoginPage,
      navigationOptions: {
        headerShown: false,
      },
    },
    ParkingDetail: {
      screen: ParkingDetail,
      navigationOptions: {
        headerShown: false,
      },
    },
    Print: {
      screen: Print,
      navigationOptions: {
        headerShown: false,
      }
    }
  },
  {
    initialRouteName: 'LoginPage',
  },
);

Но мой заголовок не отображается. Только заголовок заголовка: TabNavigator и кнопка возврата по умолчанию. Где я делаю не так? Пожалуйста, помогите мне. Спасибо.

1 Ответ

0 голосов
/ 03 марта 2020

Привет в React navigation Синтаксис последней версии 5.x изменен, попробуйте следующее

Взгляните на do c здесь Кнопки заголовка 

 static navigationOptions = ({ navigation }) => {
  return {
   headerTitle: () =>(
      <View>
        <Text>MENEMENOYS</Text>
      </View>
    ),
   headerLeft: () => (
      <TouchableOpacity
        onPress={() => {
        AuthStore.LogOut().then(() => {
          navigation.navigate('LoginPage');
        });

      }}>
      <Icon
        name="md-log-out"
        size={30}
        color={'white'}
        style={{marginLeft:10}}
      />
     </TouchableOpacity>
   ),
 };
};
...