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

force:inputField

バインドされるデータに基づいて型固有の具体的な入力コンポーネントの実装を提供するコンポーネント。

Salesforce オブジェクトの項目に対応する入力項目を表します。このコンポーネントは、関連付けられた項目の属性を考慮します。たとえば、コンポーネントが小数点以下の桁数が 2 桁の数値項目である場合、デフォルトの入力値には同じ小数点以下の桁数が含まれます。データ型に応じて入力項目を読み込みます。コンポーネントが日付項目に対応している場合、項目に日付ピッカーが表示されます。連動選択リストとリッチテキスト項目はサポートされていません。必須項目はクライアント側では強制されません。

次の例では、取引先責任者名のデータを表示する入力項目を作成します。value 属性を使用して項目をバインドし、デフォルト値を指定してオブジェクトを初期化します。

1<aura:component controller="ContactController">
2    <aura:attribute name="contact" type="Contact" 
3               default="{ 'sobjectType': 'Contact' }"/>
4    <aura:handler name="init" value="{!this}" action="{!c.doInit}" />
5    <force:inputField value="{!v.contact.Name}"/>
6</aura:component>

この例では、v.contact.Name 式が値を取引先責任者の [名前] 項目にバインドしています。レコードデータを読み込むには、取引先責任者を返す Apex コントローラにコンテナコンポーネントを接続します。

1public with sharing class ContactController {
2    @AuraEnabled
3    public static Contact getContact() {
4        return [select Id, Name from Contact Limit 1];
5    }
6}

クライアント側コントローラを介して取引先責任者データをコンポーネントに渡します。

1({
2     doInit : function(component, event, helper) {
3        var action = component.get("c.getContact");
4        action.setCallback(this, function(response) {
5            var state = response.getState();
6            if (state === "SUCCESS") {
7                component.set("v.contact", response.getReturnValue());
8                console.log(response.getReturnValue());
9            }
10         });
11         $A.enqueueAction(action); 
12    }     
13})

このコンポーネントは、Lightning Design System スタイル設定を使用しません。Lightning Design System スタイル設定を継承する入力項目が必要な場合は、lightning:input を使用します。

属性

属性名	属性型	説明
`body`	Component[]	コンポーネントのボディ。マークアップでは、これはタグのボディに含まれるすべてを指します。
`class`	String	項目の表示に使用される CSS スタイル。
`errorComponent`	Component[]	エラーメッセージの表示を行うコンポーネント。
`required`	Boolean	この項目が必須かどうかを指定します。
`value`	Object	バインドする Salesforce 項目のデータ値。

イベント

イベント名	イベントタイプ	説明
`change`	COMPONENT	ユーザが入力のコンテンツを変更したときに起動されるイベント。

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

force:inputField

属性

イベント