画面クイックアクションの作成

画面クイックアクションはモーダルウィンドウに表示されます。独自のマークアップを提供するか、lightning-quick-action-panel コンポーネントを使用して、Lightning Design System に基づく一貫したユーザインターフェースを維持します。

コンポーネントを画面クイックアクションとして使用できるようにするには、対象を設定します。「クイックアクション用のコンポーネントの設定」を参照してください。

レコードページの他の Lightning Web コンポーネントとは異なり、LWC クイックアクションは connectedCallback() の recordId を渡しません。recordId にアクセスする必要がある場合は、コードに recordId の値を設定します。

画面クイックアクションではモーダルウィンドウで Lightning Web コンポーネントが開きます。たとえば [キャンセル] ボタンを作成する目的でプログラムでモーダルウィンドウを閉じるには、カスタムイベント CloseActionScreenEvent をディスパッチする UI を作成します。lightning/actions モジュールからイベントをインポートします。

次のセクションには、完全なコードサンプルが含まれています。

一貫性のある Salesforce UI を提供するには、Lightning Web コンポーネントを lightning-quick-action-panel コンポーネントでラップします。これにより、Salesforce Lightning Design System でモーダルブループリントを使用してヘッダー、本文、フッターの一貫性が実現されます。

モーダル本文を作成する方法の 1 つは、lightning-input-field コンポーネントによって項目値が入力された lightning-record-edit-form コンポーネントを使用する方法です。キャンセルボタンと送信ボタンは lightning-record-edit-form コンポーネント内でネストする必要があるため、この方法では、フッタースロットは必要ありません。

次の例では、フッターを使用せずに lightning-record-edit-form の名前項目と電話項目に入力するフォームを作成します。**「Edit Fields Action (項目アクションを編集)」**というテキストが含まれるヘッダーを含めてモーダルウィンドウを表示します。

ユーザが送信ボタンをクリックすると、handleSuccess イベントハンドラがコールされます。このハンドラによって、CloseActionScreenEvent 関数を使用してモーダルウィンドウが閉じられます。

lightning-input コンポーネントと lightning-button コンポーネントを使用してモーダル本文でフォームを作成できます。この方法では、lightning-quick-action-panel コンポーネントのフッタースロットを使用してボタンを含めます。

次の例では、前の例と同じように取引先責任者レコードでクイックアクション用のフォームを作成し、レコードフォームコンポーネントを使用しないため、フッターのボタンを使用します。この項目には、getRecord ワイヤアダプタを使用して内部値が表示されます。

[姓] 項目が空白の場合、[保存] ボタンは無効になります。[保存] ボタンをクリックするとモーダルウィンドウが閉じ、正常に保存された場合はトーストが表示されます。レコードの変更内容を保存するには、updateRecord(recordInput, clientOptions) をコールします。

標準の LWC 機能を使用して、ナビゲーションサービスからのページ参照、レコード ID、現在のレコードのオブジェクト API 参照名を含めて、現在のページに関する情報を取得できます。

ページ参照を返すには、CurrentPageReference を lightning/navigation からインポートします。「ページ、レコード、リストへの移動」を参照してください。

レコード ID およびオブジェクト API 参照名を取得するには、recordId と objectApiName をプロパティとして公開します。「コンポーネントでのレコードコンテキストの認識」と「コンポーネントでのオブジェクトコンテキストの認識」を参照してください。

次の例では、レコード ID および現在のレコードのオブジェクト API 参照名を表示します。また、現在のページとその状態を記述する現在のページ参照も返します。

関連トピック

• 基本コンポーネントを使用したレコードの操作