本地化的react.js建议和例子

Question

我们决定在react.js上进行本地化,肯定有办法进行本地化,但您的建议是什么？

我试过yahoo的react-intl但无济于事:

var ReactIntl = require('react-intl') // we did npm install react-intl
// somewhere in the react component
render: function() {
    return (<div><ReactIntl.Number>{600}</ReactIntl.Number></div>);
}

给出错误:无法读取未定义的属性'_mockedReactClassConstructor'

花了几个小时尝试解决这个错误,仍然无法解决 - >放弃

我试过mozilla的l20n,但不确定它是否适用于react.js

想知道你对react.js本地化的建议是什么,谢谢!

Answer 1

现在已经过去几个月了。也许还有更多的本地化模块。但是，如果您希望做一些简单的事情并绕过使用这么多模块（我们只使用必要的模块来减轻负载），那么设置如下：

假设我们有一个根页面和登录页面（在我们的路由器设置中，一切基于根页面）

根

1. 有一个名为 i18n 的状态（在 getInitialState 中）
2. 检测您的语言并初始化 i18n
3. 将对象设置为 i18n 状态
4. 在 render() 中使用类似的东西

render: function() {
    var route;
    if (this.state.configLoaded && this.state.i18n) {
        route = (
            <RouteHandler i18n={this.state.i18n} onLanguageChange={this._languageChangedHandler} />
        );
    }
    return (
        <div>
            <Loading />
            {route}
        </div>
    );
}

然后你通过 props 传递 i18n 。或者如果你愿意，可以使用 mixin。

登录

this.props.i18n.t('...')