この文章は Salesforce 機械翻訳システムを使用して翻訳されました。詳細はこちらをご参照ください。

lightning:inputField

Salesforce オブジェクトの項目に対応する編集可能な入力を表します。このコンポーネントでは、API バージョン 42.0 以降が必要です。

lightning:inputField コンポーネントは、項目のデータ型に基づいて編集可能な項目を表示します。たとえば、fieldName が日付値を参照する場合、日付ピッカーを備えた日付項目が表示されます。fieldName が選択リストを参照する場合は、ドロップダウンメニューにレコードタイプに基づく値が表示されます。

このコンポーネントは、Lightning Design System のフォームレイアウトからスタイル設定を継承します。

レコード編集レイアウトを作成するには、このコンポーネントを lightning:recordEditForm と共に使用し、レコード ID とオブジェクト API 参照名を渡します。レコード作成レイアウトを作成するには、このコンポーネントを lightning:recordEditForm と共に使用し、作成するレコードのオブジェクト API 参照名を渡します。データ更新は自動的に行われるため、追加の Apex コントローラまたは Lightning データサービスは必要ありません。エラー処理をサポートするには、lightning:messages コンポーネントを含めます。レコードの編集と作成をサポートするには、lightning:button を含め、type="submit" に設定します。オブジェクトに複数のレコードタイプがあり、デフォルトのレコードタイプがない場合は、lightning:recordEditForm の recordTypeId 属性を使用してレコードタイプ ID を指定する必要があります。

取引先責任者レコードのレコード編集レイアウトとレコードビューレイアウトを表示する例を次に示します。編集を行ってから [レコードを更新] ボタンを押すと、レコードビューが自動的に更新されます。

1<aura:component>
2    <div class="slds-p-bottom_large slds-p-left_large" style="width:500px">
3        <lightning:recordEditForm aura:id="recordViewForm" 
4                                  recordId="003R00000000000000"
5                                  recordTypeId="012R00000000000000"
6                                  objectApiName="Contact">
7            <lightning:messages />
8            <lightning:inputField fieldName="FirstName" />
9                <lightning:inputField fieldName="LastName" />
10            <lightning:inputField fieldName="Birthdate" />
11            <lightning:inputField fieldName="Phone" />
12            <!--Picklist-->
13            <lightning:inputField fieldName="Level__c" />
14            <lightning:button aura:id="submit" type="submit" label="Update record" class="slds-m-top_medium" />
15        </lightning:recordEditForm>
16    </div>  
17    <!-- Record Display -->    
18    <div class="slds-p-bottom_large slds-p-left_large" style="width:500px">
19        <lightning:recordViewForm recordId="003R00000000000000" objectApiName="Contact">
20            <div class="slds-box">
21                <lightning:outputField fieldName="Name" />
22                <lightning:outputField fieldName="Birthdate" />
23                <lightning:outputField fieldName="Phone" />
24                <lightning:outputField fieldName="Level__c" />
25            </div>
26        </lightning:recordViewForm>
27    </div>   
28</aura:component>

詳細は、lightning:recordEditForm のドキュメントを参照してください。

使用上の考慮事項

連動選択リストは、lightning:inputField で使用する前に、組織で定義する必要があります。制御項目と連動項目の両方がコンポーネントに含まれている必要があります。次の例では、制御項目に LeadSource を使用し、連動項目に Level__c を使用しています。

1<lightning:recordEditForm aura:id="recordViewForm" 
2                          recordId="003R00000000000000"
3                          recordTypeId="012R00000000000000"
4                          objectApiName="Contact">
5    <lightning:messages />
6    <!--Other fields here-->
7    <lightning:inputField fieldName="LeadSource" />
8    <lightning:inputField fieldName="Level__c" />
9    <lightning:button aura:id="submit" type="submit" label="Update record" class="slds-m-top_medium"/>
10</lightning:recordEditForm>

詳細は、Salesforce ヘルプの「連動選択リストの定義」を参照してください。

属性

属性名	属性型	説明
`body`	Component[]	コンポーネントのボディ。マークアップでは、これはタグのボディに含まれるすべてを指します。
`class`	String	コンポーネントの基本クラスに加え、外部要素の CSS クラス。
`fieldName`	String	表示する項目の API 参照名。

Lightning コンポーネント開発者ガイド

lightning:inputField

属性