React-intlは反応外のメッセージを定義します

Question

私はutils.jsファイルを持っています。

export function categoryIdToCategoryName(categoryId) { 
let name; 
switch (categoryId) { 
    case constants.RISK_CATEGORY_LOW: 
     name = 'low'; 
     break; 
    case constants.RISK_CATEGORY_MEDIUM: 
     name = 'medium'; 
     break; 
    case constants.RISK_CATEGORY_HIGH: 
     name = 'high'; 
     break; 
    case constants.RISK_CATEGORY_CRITICAL: 
     name = 'critical'; 
     break; 
    default: 
     console.warn('see: /utils/risk.js', 'categoryIdToCategoryName:', categoryId); 
     name = 'unknown'; 
    } 
    return name; 
} 

私は、このテキストを翻訳したい - [低、中、高、クリティカル] https://github.com/yahoo/react-intlを使用。メッセージを定義しました。

const translations = defineMessages({ 
riskLow: { 
    id: 'utils.risk.low', 
    defaultMessage: 'low', 
}, 
riskMedium: { 
    id: 'utils.risk.medium', 
    defaultMessage: 'medium', 
}, 
riskHigh: { 
    id: 'utils.risk.high', 
    defaultMessage: 'high', 
}, 
riskCritical: { 
    id: 'utils.risk.critical', 
    defaultMessage: 'critical', 
} 
}); 

最後のステップは何ですか？

どのようにメッセージを関数に戻すことができますか？ formatMessage機能があるはずですが、それは反応の文脈でのみです。

Answer 1

あなたは直接この作業のためにヤフー国際空港ライブラリを使用することができます。https://github.com/yahoo/intl-messageformat

そうしないと、あなたのそれが呼び出す機能にコンポーネントを反応からformatMessage関数を渡すことができます。