React Native + React I18next + React Navigation, navigationOptions 更新问题

Question

我正在使用 react-i18next 和 react-navigation。

目前，我会在需要时用 withNamespaces 单独包装我的所有组件。问题是我无法使 static navigationOptions 中的 title 保持最新。它只是不更新，无论我如何分配它：作为函数或作为属性对象。 navigation.setParams 也没有更新它。

我尝试在 Navigators 本身上使用 withNamespaces 来利用 screenProps，因为它已经完成 here，但在这种情况下，我派遣的 NavigationActions 没有效果。导航就不会发生。

我假设 i18next HOC 以某种方式阻止其子节点接收参数更新事件。我是否需要以其他方式初始化 i18next 来解决这个问题？或者有没有办法强制 navigationOptions 中的 title 更新？

Answer 1

好的，我想出了一个简单的方法来解决这个问题。我制作了一个仅 returns 所需字符串的组件，并用 withNamespaces 包装它并将其放入 navigationProperties 的 title prop 中。工作正常。

这是一个示例代码。

标题组件

import React from 'react'
import PropTypes from 'prop-types'
import { withNamespaces } from 'react-i18next'
import { Text } from 'react-native'

const ScreenTitle = ({ path, t }) => <Text>{t(path)}</Text>

ScreenTitle.propTypes = {
  path: PropTypes.string.isRequired,
  t: PropTypes.func.isRequired,
}

export default withNamespaces()(ScreenTitle)

用法

static navigationOptions = () => {
  return {
    title: <ScreenTitle path="privacyPolicy:title" />,
  }
}

React Native + React I18next + React Navigation, navigationOptions 更新问题

React Native + React I18next + React Navigation, navigationOptions update issue

javascript

i18next

react-native

react-navigation

react-i18next