Aura 開発者向け ワイヤーサービスを使用したデータの取得サンプル
環境
Salesfoce
概要
Lightning Web コンポーネントでは、Salesforce データを読み取るために、
Lightning データサービス上に構築されたリアクティブなワイヤーサービスを使用します。
コンポーネントは JavaScript クラスの @wire を使用して、
lightning/ui*Api 名前空間のいずれかのワイヤーアダプターからデータを読み取ります。
1.@wire を使用してレコードを取得する
import { LightningElement, api, wire } from 'lwc'; import { getRecord, getFieldValue } from 'lightning/uiRecordApi'; import NAME_FIELD from '@salesforce/schema/Property__c.Name'; import PICTURE_FIELD from '@salesforce/schema/Property__c.Picture__c'; export default class PropertySummary extends LightningElement { @api recordId; propertyName; pictureURL; @wire(getRecord, { recordId: '$recordId', fields: [NAME_FIELD, PICTURE_FIELD] }) wiredRecord({ error, data }) { if (data) { this.propertyName = getFieldValue(data, NAME_FIELD); this.pictureURL = getFieldValue(data, PICTURE_FIELD); } else if (error) { // Handle error. Details in error.message. } } }
説明
このコードは lightning/uiRecordApi から getRecord ワイヤーアダプターをインポートします。
2.Property カスタムオブジェクトの Name 項目への参照をインポートします。
import NAME_FIELD from '@salesforce/schema/Property__c.Name’;
@api デコレーターは recordId プロパティを公開します。propertySummary を
含む親コンポーネントは、
その HTML ファイルの record-id 属性の値を設定します。