フローインタビュー完了時の動作の制御

カスタム lightning-flow コンポーネントにフローを埋め込むことで、フローの完了時の動作を指定できます。

このコンポーネントを使用するには、その前に、Salesforce Flow Builder でフローを作成します。このコンポーネントには、戻る、次へ、一時停止、完了のナビゲーションボタンが含まれています。

フローに、カスタムの Lightning Web コンポーネントまたは Aura コンポーネントがある場合、Lightning Web Runtime を使用する Experience Cloud サイトで lightning-flow を使用することができません。

Note

例

デフォルトでは、フローユーザが [完了] をクリックすると、新しいインタビューが開始されて、ユーザにフローの最初の画面が再度表示されます。カスタム lightning-flow コンポーネントにフローを埋め込み、onstatuschange イベントハンドラを使用して、フローの完了時の動作を指定できます。

他のページにリダイレクトするには、ナビゲーションサービスを使用します。
自動起動フローの終了時の動作を制御するには、FINISHED_SCREEN の状況をチェックします。

1<!-- myComponent.html -->
2<template>
3  <lightning-flow flow-api-name="myFlow" onstatuschange={handleStatusChange}> </lightning-flow>
4</template>

1// myComponent.js
2handleStatusChange(event) {
3    if(event.detail.status === 'FINISHED') {
4        // Redirect to another page in Salesforce., or
5        // Redirect to a page outside of Salesforce., or
6        // Show a toast, or something else
7    }
8}

次の例では、 lightning/navigation NavigationMixin.Navigate メソッドを使用して、フローで作成されたケースにユーザをリダイレクトします。

1// myComponent.js
2import { LightningElement } from "lwc";
3import { NavigationMixin } from "lightning/navigation";
4
5export default class MyComponent extends NavigationMixin(LightningElement) {
6  navigateToRecord(recordId) {
7    this[NavigationMixin.Navigate]({
8      type: "standard__recordPage",
9      attributes: {
10        recordId,
11        actionName: "view",
12      },
13    });
14  }
15
16  handleStatusChange(event) {
17    if (event.detail.status === "FINISHED") {
18      const outputVariables = event.detail.outputVariables;
19      for (let i = 0; i < outputVariables.length; i++) {
20        const outputVar = outputVariables[i];
21        if (outputVar.name === "redirect") {
22          this.navigateToRecord(outputVar.value);
23        }
24      }
25    }
26  }
27}

詳細は、「ナビゲーション」を参照してください。

The Japanese Summer '24 guide is now live

日本語の Summer '24 ガイドが公開されました! 「Component Reference (コンポーネントリファレンス)」は、以前と同様にコンポーネントライブラリにあります。