6

react-intlこの種の使用法に関するドキュメント (私はv2ブランチを使用しています) には何も見つからないため、この問題が発生します。次のユースケースに推奨されるアプローチはありますか?

2 つのコンポーネントがあるTooltipとしSelectます。どちらも同じ i18n 形式の文字列が必要です。次のように言います。

<FormattedMessage
    id='ui.widget.cycleOffsetSelector.timeCycle.label'
    defaultMessage="This {cycle}"
    values={{cycle: props.cycle}}
/>

他のコンポーネントで同じメッセージを使用するにはどうすればよいですか? これを使用するだけです:

<FormattedMessage
    id='ui.widget.cycleOffsetSelector.timeCycle.label'
    values={{cycle: props.cycle}}
/>

動作しません (すべきではありません:))。それで、これを行う正しい方法は何ですか?これらの共有メッセージをアプリ内のどこかにグローバルに保持する必要がありますか? 「共有」された intl メッセージのリストをコードとは別に維持するのは煩雑になる可能性があるため、react-intl解決すると主張するまさにそのことです。

4

1 に答える 1

9

react-intl v2 では、メッセージ ID は静的であるため、2 つの ID が同じになることはありません。開発を容易にするために、コンポーネントで使用されているアセットを同じファイルに保持することを考えています。次に、翻訳のためにビルド時に文字列を抽出します。多くの場合、この問題は、メッセージ文字列を再利用する代わりに、高次コンポーネント (HOC) を作成するか、再利用するコンポーネントを作成することで解決できます。

HOC を作成できない場合は、この問題を処理するいくつかの方法があります。


一元化されたメッセージ ファイルでdefineMessages()を使用して、再利用する共通の文字列を定義し、それらのコンポーネント内の特定のコンポーネント専用の文字列を保持できます。


名前空間 ID も可能です。

ui.widget.cycleOffsetSelector.timeCycle.select.label ui.widget.cycleOffsetSelector.timeCycle.tooltip.label

于 2016-05-24T14:09:36.213 に答える