Question

嗨，我有新的反应，现在我使用反应样板开发了前端.. 我试图在我的应用程序中添加新语言。我遵循此文档：i18n docs 生成（添加）新语言并提取所有语言..

但现在我很困惑如何测试它是否有效..我可以将DEFAULT_LOCALE（\ app \ containers \ App \ constants.js）值更改为我想要的语言说明符测试，它会工作。但我希望通过在客户端设置区域设置来测试它，然后react-boilerplate将检测它应显示的区域设置。

问题：

这个反应 - 样板如何检测区域设置？从浏览器接受的语言/浏览器语言/客户端操作系统语言？
如何在运行中更改react-boilerplate语言环境？

请提出一些启示..非常感谢提前..

Answer 1

您可以使用以下代码获取浏览器的语言。请注意，此方法将以Chrome而不是Chrome的显示语言返回用户的“首选语言”。仍然大部分是准确的。

var userLang = navigator.language || navigator.userLanguage;

在containers/LanguageProvider/actions.js中，您可以在应用程序中的任何位置分派提供的changeLocale动作创建者，以即时更改语言。

关于将检测到的语言环境设置为默认语言，您可以如下修改LanguageProvider容器：

...other imports
import {changeLocale} from './actions';

export class LanguageProvider extends React.PureComponent {
  componentDidMount() {
    this.props.changeLocale(navigator.language || navigator.userLanguage);

  }
  // eslint-disable-line react/prefer-stateless-function
  render() {
    return (
      <IntlProvider
        locale={this.props.locale}
        key={this.props.locale}
        messages={this.props.messages[this.props.locale]}
      >
        {React.Children.only(this.props.children)}
      </IntlProvider>
    );
  }
}

LanguageProvider.propTypes = {
  locale: PropTypes.string,
  messages: PropTypes.object,
  children: PropTypes.element.isRequired,
};

const mapStateToProps = createSelector(makeSelectLocale(), locale => ({
  locale,
}));

function mapDispatchToProps(dispatch) {
  return {
    changeLocale: (lang) => dispatch(changeLocale(lang)),
  };
}
... other code

请注意，如果使用美国语言，这会将语言环境设置为en-US的格式，因此您必须重新设置字符串格式或更改翻译文件夹中语言文件的名称。希望这能回答您的问题。

Answer 2

以下是我对你问题的回答。

1）这取决于浏览器的默认语言。

2）我认为没有特别的方法。尝试根据您的偏好选择一种语言。

Answer 3

我复制了react-boilerplate更改区域设置功能，只是认识到演示版已经包含该功能。它没有检查我知道的浏览器或客户端操作系统语言，但它使用默认显示语言的DEFAULT_LOCALE设置。

react-boilerplate i18n更改区域设置

3 个答案: