React 应用程序 i18n 支持

Question

我们有一个 React 应用程序，其中所有小部件的标签都是从属性文件中读取的，

属性文件：

export const properties = {
  dashboardcrumb_label: 'DASHBOARD',
  channelcrumb_label: 'CHANNELS',
    jobcard_header: 'JOBS',
    cancel_label: 'CANCEL'
  }

在js文件中的使用（示例）：

import { properties } from '../../../../resources/label_property'
<FlatButton label={properties.cancel_label}

现在我们需要使其兼容 i18n。请提出一种更简单的方法来实现 i18n，我可以在 js 中没有太多更改的情况下重用这个属性文件

Answer 1

您可以使用withNamespace hoc 包装您的组件，如下所示：

import { withNamespaces } from 'react-i18next';
// it would add 't' and 'lng' in the props
const { t } =this.props;
<FlatButton label={t('cancel_label')}

我个人建议你使用reaact-intl