如何在React-Navigation中更改标题文本和标签文本？

Question

我在标签导航器中有一个嵌套的堆栈导航器，如下所示：

BookmarkList

当我为BookmarkList设置navigationOptions标题文字时，它只会更改标题文字，而不会更改标签文字。

例如，我已将My Bookmarks标题设为class BookmarkList extends Component { static navigationOptions = { title: 'My Bookmarks' }; } 。

BookmarkList

这会反映在标题文字中，但不会显示在标签文字中，标题文字仍显示{{1}}（以红色圈出）：

如何让标题和标签文本更改为相同的文字？

tldr; 通过navigationOptions自定义标题只会更改标题文本，而不会更改标签导航器中嵌套堆栈导航器中的标签文本。如何更改标题和标签文本？

Answer 1

一个解决方案：

    const BookmarksList = createStackNavigator({
      BookmarkList: { screen: BookmarkList },
      UpdateBookmark: { screen: UpdateForm },
    });

    const NewBookmark = createStackNavigator({
      NewBookmark: { screen: NewBookmarkScreen },
    });

    const MainNavigator = createBottomTabNavigator({
      BookmarksList: {
        screen: BookmarksList,
        navigationOptions: {
          title: 'My Bookmarks',
        },
      },
      NewBookmark: {
        screen: NewBookmark,
        navigationOptions: {
          title: 'New Bookmarks',
        },
      },
    });

Answer 2

我有两个重复的标头，@aciobanita的解决方案，因为我有一个父AppContainer，所以有必要停用父标头，然后使用@aciobanita的解决方案，它对我来说没有问题

const AppNavigator = createStackNavigator(
  {
    MainApplication: { 
      screen: MainApplication,
    },
  },
  {
    headerMode: 'none'
  }
);

export default createAppContainer(AppNavigator);

子组件：

    const BookmarksList = createStackNavigator({
      BookmarkList: { screen: BookmarkList },
      UpdateBookmark: { screen: UpdateForm },
    });

    const NewBookmark = createStackNavigator({
      NewBookmark: { screen: NewBookmarkScreen },
    });

    const MainNavigator = createBottomTabNavigator({
      BookmarksList: {
        screen: BookmarksList,
        navigationOptions: {
          title: 'My Bookmarks',
        },
      },
      NewBookmark: {
        screen: NewBookmark,
        navigationOptions: {
          title: 'New Bookmarks',
        },
      },
    });


export default createAppContainer(MainNavigator);