在轨道上反应/反应国际

Posted 2023-02-15

【中文标题】在轨道上反应/反应国际

【英文标题】：react on rails / react intl

【发布时间】：2018-06-08 04:44:39

【问题描述】：

我正在尝试按照本指南为 rails/react_on_rails 项目实施 i18n； https://github.com/shakacode/react_on_rails/blob/master/docs/basics/i18n.md

我收到错误“未定义格式消息”，所以我可能遗漏了一些东西，这是我的代码：

import PropTypes from 'prop-types';
import React from 'react';
import  IntlProvider  from 'react-intl';

import  addLocaleData  from 'react-intl';
import en from 'react-intl/locale-data/en';
import nb from 'react-intl/locale-data/nb';
import  translations  from '../../../libs/i18n/translations';
import  defaultLocale  from '../../../libs/i18n/default';

// Initizalize all locales for react-intl.
addLocaleData([...en, ...nb]);

// set locale and messages for IntlProvider.
// const locale = method_to_get_current_locale() || defaultLocale;
const locale = defaultLocale;
const messages = translations[locale];

import  defaultMessages  from '../../../libs/i18n/default';


export default class TextMessage extends React.Component 

  render() 
    return (
      <IntlProvider locale=locale key=locale messages=messages>   
         formatMessage(defaultMessages.ActionsYes) 
      </IntlProvider>

    );
  

【参考方案1】：

您会收到确切的错误消息：

formatMessage 未定义

我一直在使用react-intl，所以我相信您需要做的是首先注入intl 对象。您可以在 react-intl 文档中了解它。试试这个：

import  IntlProvider, injectIntl  from 'react-intl';

...

class TextMessage extends React.Component 


  render() 

    return (
      <IntlProvider locale=locale key=locale messages=messages>
         this.props.intl.formatMessage(defaultMessages.ActionsYes) 
      </IntlProvider>

    );
  


export default injectIntl(TextMessage);

我打赌它会起作用的。

或者更简单的只是改变这个：

import  IntlProvider, FormattedMessage  from 'react-intl';

...

export default class TextMessage extends React.Component 
  render() 
    return (
       <IntlProvider locale=locale key=locale messages=messages>
        <FormattedMessage ...defaultMessages.ActionsYes />
       </IntlProvider>

    );
  

【讨论】：

这里小跟进，使用上一个版本我又报错了；失败的道具类型：道具id在FormattedMessage中标记为必填，但其值为undefined。

您需要将id 和defaultMessage 属性传递给FormattedMessage。制作console.log(defaultMessages.ActionsYes) 并检查是否有它们。