Lightning Aura Components Developer Guide (Lightning Aura コンポーネント開発者ガイド)
jレコードの読み込み
- 読み込むレコードの ID
- 読み込んだレコードを割り当てるコンポーネント属性
- 読み込む項目のリスト
読み込む項目のリストを指定するには、fields 属性を使用します。たとえば、fields="Name,BillingCity,BillingState" です。
または、layoutType 属性を使用してレイアウトを指定することもできます。そのレイアウトのすべての項目がレコードに読み込まれます。レイアウトは、プロファイルのページレイアウトの割り当てに応じて異なります。たとえば、マーケティングユーザプロファイルを使用するユーザにデフォルトの取引先レイアウトが割り当てられている場合、そのユーザはそのレイアウトのすべての項目を使用できます。レイアウトは通常システム管理者が変更するため、特定の項目を要求する場合 layoutType は fields ほど柔軟ではありません。layoutType を使用してレコードデータを読み込むと、コンポーネントをレイアウト定義に適合させることができます。layoutType の有効な値は、FULL および COMPACT です。
システム管理者がレイアウトにその項目を追加したかどうかにかかわらず、オブジェクトの項目を取得するには、fields 属性を使用して名前で項目を要求します。特定の項目をコンポーネントで常に使用できるようにするには、レイアウトのすべての項目を取得し、さらにその項目を指定します。
targetRecord には、要求された layoutType に関連する項目、または fields 属性に一覧表示される項目を含む現在のレコードが入力されます。targetFields には、読み込まれたレコードの簡易ビューが入力されます。たとえば Name 項目の場合、v.targetRecord.fields.Name.value は v.targetFields.Name に相当します。
レコードの読み込み
次の例は、Lightning データサービスを使用したレコードの読み込みの要点を示しています。このコンポーネントは、Lightning アプリケーションビルダーのレコードホームページに追加するか、カスタムアクションとして追加することができます。レコード ID は、force:hasRecordId インターフェースによって追加される暗黙的な recordId 属性によって指定されます。
1<aura:component implements="flexipage:availableForRecordHome,force:lightningQuickActionWithoutHeader, force:hasRecordId">
2
3 <aura:attribute name="record" type="Object"/>
4 <aura:attribute name="simpleRecord" type="Object"/>
5 <aura:attribute name="recordError" type="String"/>
6
7 <force:recordData aura:id="recordLoader"
8 recordId="{!v.recordId}"
9 targetFields="{!v.simpleRecord}"
10 targetError="{!v.recordError}"
11 recordUpdated="{!c.handleRecordUpdated}"
12 />
13
14 <!-- Display a lightning card with details about the record -->
15 <div class="Record Details">
16 <lightning:card iconName="standard:account" title="{!v.simpleRecord.Name}" >
17 <div class="slds-p-horizontal--small">
18 <p class="slds-text-heading--small">
19 <lightning:formattedText title="Billing City" value="{!v.simpleRecord.BillingCity}" /></p>
20 <p class="slds-text-heading--small">
21 <lightning:formattedText title="Billing State" value="{!v.simpleRecord.BillingState}" /></p>
22 </div>
23 </lightning:card>
24 </div>
25
26 <!-- Display Lightning Data Service errors, if any -->
27 <aura:if isTrue="{!not(empty(v.recordError))}">
28 <div class="recordError">
29 {!v.recordError}</div>
30 </aura:if>
31</aura:component>1({
2 handleRecordUpdated: function(component, event, helper) {
3 var eventParams = event.getParams();
4 if(eventParams.changeType === "LOADED") {
5 // record is loaded (render other component which needs record data value)
6 console.log("Record is loaded successfully.");
7 console.log("You loaded a record in " +
8 component.get("v.simpleRecord.Industry"));
9 } else if(eventParams.changeType === "CHANGED") {
10 // record is changed
11 } else if(eventParams.changeType === "REMOVED") {
12 // record is deleted
13 } else if(eventParams.changeType === "ERROR") {
14 // there’s an error while loading, saving, or deleting the record
15 }
16 }
17})レコードを読み込むか更新する場合に、JavaScript コントローラでレコードの項目にアクセスするには、component.get("v.simpleRecord.fieldName") 構文を使用します。
force:recordData は、サーバーにアクセスしてデータを取得する場合があるため、意図的にデータを非同期で読み込みます。レコードがいつ読み込まれたかまたは変更されたかを追跡するには、前の例で示されているように recordUpdated イベントを使用します。または、targetRecord または targetFields に提供されている属性に変更ハンドラを配置することもできます。