Question

我正在掌握react并在应用程序中使用react-localize-redux包。烦人的是，只需将该骨架复制/粘贴到每个可本地化的组件中即可：

import { getTranslate } from 'react-localize-redux'
...
private translate = (key: string): string => {
        return this.props.translate ? this.props.translate(key).toString() : key
    }
...
render() {
<div>{this.translate('HelloString')}</div>
}

...
function mapStateToProps(state: RootState) {

    return {        
        translate: getTranslate(state.locale)
    }
}

export default connect(mapStateToProps)(MyComponent)

即

始终定义翻译包装函数（因为测试不使用redux且未定义getTranlate函数）
导入redux内容并编写相同的mapStateToProps
编写this.translate（“翻译文件中的某些键”）

我正在寻找创建单个组件或模块，可以将其导入任何组件并通过其属性/方法引用转译文本：

所需的结构将是（正如我在React Sharepoint中简要看到的那样）

import MyLocalizer from 'somewhere'

...

render() {
<div>MyLocalizer.HelloString</div>
}

这会将HelloString解析为基于当前语言环境的翻译字符串。

我当时正在考虑使用空的渲染函数创建组件来封装这些组件。也许它将具有公共翻译方法，但我不确定。

react-localize-redux本地化，每个组件中没有重复的代码

0 个答案: