インストール

モジュールをインストールします: 

  1. npm install @wordpress/react-i18n

このパッケージは、あなたのコードがES2015+環境で実行されることを前提としています。そのような言語機能やAPIのサポートが限られているか、まったくない環境を使用している場合は、コードに@wordpress/babel-preset-defaultで提供されるポリフィルを含める必要があります。

API

I18nProvider

  2. *使用法*  
  5. ``````bash
  6. import { createI18n } from '@wordpress/i18n';
  7. import { I18nProvider } from '@wordpress/react-i18n';
  8. const i18n = createI18n();
  10. ReactDom.render(
  11.    <I18nProvider i18n={ i18n }>
  12.    <App />
  13.    </I18nProvider>,
  14.    el
  15. );
  16. `
  2. デフォルトの`````I18n`````インスタンスが`````@wordpress/i18n`````からエクスポートされます。  
  4. *パラメータ*  
  6. - props `````I18nProviderProps`````: i18nプロバイダーのプロパティ。
  8. *戻り値*  
  10. - `````JSX.Element`````: I18nProviderでラップされた子要素。
  11.  <a name="usei18n"></a>
  14. ### useI18n
  16. i18n関数へのアクセスを提供するReactフックです。[`````@wordpress/i18n`````](https://developer.wordpress.org/block-editor/reference-guides/packages/i18n)から``````````、`````_x`````、`````_n`````、`````_nx`````、`````isRTL`````、および`````hasTranslation`````関数を公開します。そちらのドキュメントを参照してください。  
  18. *使用法*  
  21. ``````bash
  22. import { useI18n } from '@wordpress/react-i18n';
  24. function MyComponent() {
  25.    const { __ } = useI18n();
  26.    return __( 'Hello, world!' );
  27. }
  28. `

withI18n

i18n翻訳関数（useI18nフックによって公開されるのと同じセット）をラップされたコンポーネントにプロパティとして渡すReact高階コンポーネントです。

使用法 

  1. import { withI18n } from '@wordpress/react-i18n';
  3. function MyComponent( { __ } ) {
  4.    return __( 'Hello, world!' );
  5. }
  7. export default withI18n( MyComponent );

パラメータ

  • InnerComponent ComponentType< P >: ラップされ、``````````のようなi18n関数を受け取るReactコンポーネント

戻り値

  • FunctionComponent< PropsAndI18n< P > >: ラップされたコンポーネント

このパッケージへの貢献

これはGutenbergプロジェクトの一部である個別のパッケージです。このプロジェクトはモノレポとして整理されています。特定の目的を持つ複数の自己完結型ソフトウェアパッケージで構成されています。このモノレポ内のパッケージは、https://www.npmjs.com/に公開され、https://make.wordpress.org/core/や他のソフトウェアプロジェクトで使用されています。

このパッケージやGutenberg全体への貢献について詳しく知りたい場合は、プロジェクトの主要なhttps://github.com/WordPress/gutenberg/tree/HEAD/CONTRIBUTING.mdをお読みください。