Javascript 根据React Native中的状态更新tabBarLabel

我有一个带有导航器的React本机应用程序。我还有几个屏幕和一个标题（所有屏幕都有）

在我的标题中，我有一个按钮，可以切换应用程序的语言。通过将语言传递给导航器的道具，我可以在屏幕上访问它并翻译周围的内容

我唯一不能更改的是每个屏幕的

navigationOptions

中的

tabBarLabel

属性

我试着简单地写下：

MyStack1.navigationOptions = {
    tabBarLabel: myGlobalTranslationFunction('MyOriginalLabel1', this.props.screenProps.language)
};

但那没用

作为一个树，你可以认为App是我的App的根，它有一个

状态。language

通过以下方式传递给导航器：

<Navigator screenProps={ {language: this.state.language} }/>

---

我认为这个问题在于定义标签依赖于语言属性，但我不知道如何做到这一点。我曾考虑为导航器编写一个实际的类来扩展React.Component，但我不确定是如何做到这一点的，因为上面的代码基本上就是我根据文档得到的。

您使用的是什么

React navigation

版本

您可以通过

Navigator

的

screenProps

传递翻译

<Navigator screenProps={{
  myStack1: i18n._('stack1TabBarLabel'),
  myStack2: i18n._('stack2TabBarLabel')
}}/>

<Navigator screenProps={{
  myStack1: i18n._('stack1TabBarLabel'),
  myStack2: i18n._('stack2TabBarLabel')
}}/>

export default createBottomTabNavigator({
    myStack1: {
      screen: MyStack1,
      navigationOptions: ({ screenProps }) => ({
        tabBarLabel: screenProps && screenProps.myStack1
      })
    },
    myStack2: {
      screen: MyStack2,
      navigationOptions: ({ screenProps }) => ({
        tabBarLabel: screenProps && screenProps.myStack2
      })
    }
  },
  {
    initialRouteName: 'myStack1',
    tabBarOptions: {
        showLabel: true
    }
  }
);