コンポーネントでのレコードコンテキストの認識

コンポーネントにそのレコードコンテキストを認識させることが役に立つ使用事例があります。たとえば、レコードコンテキストを提供して、表示中のレコードページでコンポーネントが子レコード情報を返して表示できるようにしたいとします。コンポーネントがオブジェクトコンテキストを認識できるようにするには、Lightning レコードページで recordId プロパティを使用します。ページは、プロパティを現在のレコードの ID に設定します。

lwc-recipes リポジトリには、表示中の取引先責任者レコードに関するデータを返す wireGetRecordDynamicContact コンポーネントがあります。

コンポーネントの JavaScript クラスで、@api デコレーターを使用して公開 recordId プロパティを作成します。

Lightning Experience またはモバイルアプリケーションのレコードコンテキストでコンポーネントを呼び出すと、recordId はレコードの 18 文字 ID (例: 001xx000003DGSWAA4) に設定されます。

recordId プロパティを持つコンポーネントをレコードのコンテキスト上に直接配置することで、自動入力されるようにします。recordId 値を必要とする子コンポーネントがある場合は、コンテナコンポーネントでレコード ID を取得して、子コンポーネントに渡します。

recordId プロパティを JavaScript クラスに含めます。

子コンポーネント c/component では、使用事例に応じて getRecord ワイヤーアダプターまたは別のアダプターを使用してレコードデータを取得できます。たとえば、アカウントの請求先住所に基づいて地図を読み込む子コンポーネントにレコード ID を渡すことができます。

recordId は、明示的なレコードコンテキストでコンポーネントを配置または呼び出す場合にのみ自動で設定されます。その他の場合、recordId は設定されないため、コンポーネントでこれを使用することはできません。このような場合は、recordId を自分で設定できます。たとえば、クイックアクションに使用されるコンポーネントは、レコードページで使用されるときにレコード ID にアクセスする必要がある場合、明示的に recordId を設定できます。

エクスペリエンスビルダーサイトは、recordId をコンポーネントのテンプレートに自動的にバインドしません。

コンポーネント上で @api デコレーターを含めて公開 recordId プロパティを作成したら、コンポーネントの *.js-meta.xml ファイルの式に recordId を追加します。targets パラメーターで指定されたすべてのページ種別は、レコード ID にアクセスできます。

エクスペリエンスビルダーサイトのレコードコンテキストでコンポーネントを呼び出すと、式 "{!recordId}" はレコードの 18 文字 ID に設定されます。

関連トピック