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

lightning:inputName

名前複合項目を表します。このコンポーネントでは、API バージョン 42.0 以降が必要です。

lightning:inputName コンポーネントは、text 型の HTML input 要素として表される名前複合項目です。[敬称] 項目は、ドロップダウンメニューで、表示ラベル - 値ペアの配列を受け入れます。

次の例では、名、ミドルネーム、姓、非公式名、サフィックスの項目を含む名前複合項目を作成します。[敬称] ドロップダウンメニューには、デフォルトで [Mr.] が表示されます。fieldsToDisplay 属性によって、表示される項目が決まります。

1<aura:component>
2    <aura:attribute name="salutationOptions" type="List" default="[
3        {'label': 'None', 'value': 'None'},
4        {'label': 'Mr.', 'value': 'Mr.'},
5        {'label': 'Ms.', 'value': 'Ms.'},
6        {'label': 'Mrs.', 'value': 'Mrs.'},
7        {'label': 'Dr.', 'value': 'Dr.'},
8        {'label': 'Prof.', 'value': 'Prof.'},
9    ]"/>
10    <aura:attribute name="fields" type="List" default="['firstName', 'lastName']"/>
11    <div class="slds-size_1-of-2">
12        <lightning:inputName
13            aura:id="myname"
14            label="Contact Name"
15            firstName="John"
16            middleName="Middleton"
17            lastName="Doe"
18            informalName="Jo"
19            suffix="The 3rd"
20            salutation="Mr."
21            options="{!v.salutationOptions}"
22            fieldsToDisplay="{!v.fields}"
23        />
24     </div>
25</aura:component>

使用上の考慮事項

required="true" を設定すると、必須であることを示す赤いアスタリスクが [姓] 項目に表示されます。ユーザが [姓] 項目を操作し、空白のままにした場合は、項目の下にエラーメッセージが表示されます。required 属性は適用されないため、名前複合項目を含むフォームを送信する前に検証する必要があります。

たとえば、handleClick コントローラアクションをコールする lightning:button コンポーネントがある場合、ユーザが [姓] 項目に値を入力せずにボタンをクリックしたときに、エラーメッセージを表示することができます。

1({
2    handleClick: function (cmp, event) {
3        var name = cmp.find("myname");
4        var isValid = name.checkValidity();
5        if(isValid) {
6            alert("Creating new contact for " + name.get("v.lastName"));
7        }
8        else {
9            name.showHelpMessageIfInvalid();
10        }
11    }
12})

属性

属性名	属性型	説明
`body`	Component[]	コンポーネントのボディ。マークアップでは、これはタグのボディに含まれるすべてを指します。
`class`	String	コンポーネントの基本クラスに加え、外部要素の CSS クラス。
`disabled`	Boolean	複合項目を無効にするかどうかを指定します。無効な項目はグレー表示され、クリックできません。この値のデフォルトは false です。
`fieldsToDisplay`	List	コンポーネントに表示される項目のリスト。この値のデフォルトは ['firstName', 'salutation', 'lastName'] です。その他の項目値には、middleName、informalName、suffix があります。
`firstName`	String	[名] 項目を表示します。
`informalName`	String	[非公式名] 項目を表示します。
`label`	String	複合項目のテキスト表示ラベル。
`lastName`	String	[姓] 項目を表示します。required を true に設定すると、この項目は常に表示されます。
`middleName`	String	[ミドルネーム] 項目を表示します。
`onblur`	Action	入力がフォーカスを解放したときにトリガされるアクション。
`onchange`	Action	値が変更された場合にトリガされるアクション。
`onfocus`	Action	入力にフォーカスが設定されたときにトリガされるアクション。
`options`	List	表示ラベル - 値ペアとして指定された Dr. や Mrs. などの敬称オプションのリストを表示します。
`readonly`	Boolean	複合項目が参照のみかどうかを指定します。この値のデフォルトは false です。
`required`	Boolean	複合項目に入力する必要があるかどうかを指定します。赤いアスタリスクが [姓] 項目に表示されます。ユーザが [姓] 項目を操作し、値を指定しなかった場合は、エラーメッセージが表示されます。この値のデフォルトは false です。
`salutation`	String	[敬称] 項目をドロップダウンメニューとして表示します。オプション属性を使用して表示ラベル - 値ペアの配列を指定する必要があります。
`suffix`	String	[サフィックス] 項目を表示します。
`title`	String	マウスポインタが要素に重ねられたときにツールチップテキストを表示します。
`variant`	String	バリエーションによって複合項目の外観が変更されます。使用できるバリエーションは standard と label-hidden です。この値のデフォルトは standard です。

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

lightning:inputName

属性