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

カスタムアクション用のコンポーネントの設定

force:lightningQuickAction または force:lightningQuickActionWithoutHeader インターフェースを Lightning コンポーネントに追加し、Lightning Experience または Salesforce1 でカスタムアクションとして使用できるようにします。これらのインターフェースのいずれかを実装するコンポーネントを Lightning Experience と Salesforce1 の両方でオブジェクト固有のアクションとして使用できます。Salesforce1 でのみこれらのコンポーネントをグローバルアクションとして使用できます。

アクションとして使用する場合、force:lightningQuickAction インターフェースを実装するコンポーネントは [キャンセル] ボタンなどの標準アクションコントロールがあるパネルに表示されます。これらのコンポーネントにも専用のコントロールを表示でき、実装できますが、標準コントロールからのイベント用に設定されている必要があります。

force:lightningQuickActionWithoutHeader インターフェースを実装するコンポーネントは、追加のコントロールなしでパネルに表示され、アクションの完全なユーザインターフェースを提供します。

これらのインターフェースは相互に排他的です。つまり、コンポーネントに force:lightningQuickAction インターフェースまたは force:lightningQuickActionWithoutHeader インターフェースのどちらかを実装できますが、この両方を実装することはできません。コンポーネントは両方の標準ユーザインターフェース要素を表示できないため、両方の標準ユーザインターフェースを表示しません。

コンポーネントの例

カスタムアクションで使用できるコンポーネントの例を次に示します。カスタムアクションの名前は、「Quick Add」など自由に設定することができます (コンポーネントの名前と、そのコンポーネントを使用するアクションの名前が一致する必要はありません)。このコンポーネントでは、2 つの数をすばやく合計することができます。

1<!--quickAdd.cmp-->
2<aura:component implements="force:lightningQuickAction">
3
4    <!-- Very simple addition -->
5
6    <ui:inputNumber aura:id="num1"/> +
7    <ui:inputNumber aura:id="num2"/>
8
9    <br/>
10    <ui:button label="Add" press="{!c.clickAdd}"/>
11
12</aura:component>

コンポーネントマークアップは 2 つの入力項目と [追加] ボタンを表示するだけです。

コンポーネントのコントローラが実際のすべての作業を実行します。

1/*quickAddController.js*/
2({
3    clickAdd: function(component, event, helper) {
4
5        // Get the values from the form
6        var n1 = component.find("num1").get("v.value");
7        var n2 = component.find("num2").get("v.value");
8
9        // Display the total in a "toast" status message
10        var resultsToast = $A.get("e.force:showToast");
11        resultsToast.setParams({
12            "title": "Quick Add: " + n1 + " + " + n2,
13            "message": "The total is: " + (n1 + n2) + "."
14        });
15        resultsToast.fire();
16
17        // Close the action panel
18        var dismissActionPanel = $A.get("e.force:closeQuickAction");
19        dismissActionPanel.fire();
20    }
21
22})

ユーザが入力した 2 つの数の取得は簡単ですが、より強固なコンポーネントでは、入力が有効かどうかの確認などを行います。この例の重要な部分は、数がどのように処理されるかと、カスタムアクションがどのように解決するかです。

加算の結果は「toast」に表示されます。これは、ページの上部に表示される状況メッセージです。このトーストは、force:showToast イベントを起動することで作成されます。トーストは結果を表示できる唯一の方法ではありません。また、アクションはトースト専用でもありません。これは、単に Lightning Experience または Salesforce1 の画面の上部にメッセージを表示するための便利な方法です。

ここでトーストを使用していることに関して重要なことは、その後どのように処理されるかということです。clickAdd コントローラアクションは force:closeQuickAction イベントを起動します。これにより、アクションパネルが閉じられます。ただし、アクションパネルが閉じられてもトーストは依然として表示されます。force:closeQuickAction イベントはアクションパネルによって処理されますが、アクションパネルは閉じられています。force:showToast イベントは one.app コンテナによって処理されるため、パネルが動作している必要はありません。

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

カスタムアクション用のコンポーネントの設定

コンポーネントの例

関連項目: