例: 呼び出し可能なアクションの汎用 sObject 入力

この例では、汎用 sObject 入力パラメータを使用するカスタムプロパティエディタを作成します。呼び出し可能なアクションは、フローに追加できる Apex メソッドです。Flow Builder では、システム管理者は選択リスト項目を使用して、呼び出し可能なアクションの入力パラメータ (レコード変数のオブジェクト、レコード変数、出力を保存するオブジェクト) を設定します。ユーザがこの例のフローを実行すると、呼び出し可能なアクションでレコードのコレクションの最初のレコードが保存されます。

この Apex クラスファイルは、呼び出し可能なアクションとして実行できる selectRecord メソッドとその入力変数を定義します。@InvocableMethod アノテーションは、呼び出し可能なアクションとして実行できるメソッドを識別します。@InvocableVariable アノテーションは、呼び出し可能なメソッドによって使用される変数を識別します。

呼び出し可能なメソッドは、configurationEditor 修飾子でカスタムプロパティエディタを登録します。組織にカスタム名前空間がなければ、名前空間は c になります。組織にカスタム名前空間があれば、その名前空間を使用してカスタムプロパティエディタを登録します。この例では、カスタムプロパティエディタの名前は c-select-record-editor になっています。

1// SelectRecordAction.cls
2public with sharing class SelectRecordAction {
3    @InvocableMethod(configurationEditor='c-select-record-editor')
4    public static List <Results> selectRecord(List<Requests> requestList) {
5        List<SObject> inputCollection = requestList[0].inputCollection;
6        //Store the first input record for output
7        SObject outputMember = inputCollection[0];
8        Results response = new Results();
9        response.outputMember = outputMember;
10        List<Results> responseWrapper= new List<Results>();
11        responseWrapper.add(response);
12        return responseWrapper;
13    }
14
15public class Requests {
16    @InvocableVariable(label='Object for Input' description='Records for Input')
17    public List<SObject> inputCollection;
18    }
19
20public class Results {
21    @InvocableVariable(label='Object for Storing Output' description='Records for Output')
22    public SObject outputMember;
23    }
24}

次の HTML、CSS、JavaScript、設定ファイルは、アクションのカスタムプロパティエディタを定義します。

HTML テンプレートは、Flow Builder のカスタムプロパティエディタの UI を定義します。

1<!--selectRecordEditor.html-->
2<template>
3  <lightning-combobox
4    name="inputType"
5    label="Object for Record Variable"
6    value={inputType}
7    placeholder="Select object..."
8    options={typeOptions}
9    onchange={handleInputTypeChange}
10  >
11  </lightning-combobox>
12
13  <lightning-combobox
14    name="outputType"
15    label="Object for Storing Output"
16    value={outputType}
17    placeholder="Select object..."
18    options={typeOptions}
19    onchange={handleOutputTypeChange}
20  >
21  </lightning-combobox>
22
23  <lightning-combobox
24    name="inputValue"
25    label="Record Variable"
26    value={inputValue}
27    placeholder="Select record variable..."
28    options={valueOptions}
29    onchange={handleValueChange}
30  >
31  </lightning-combobox>
32
33  <div class="slds-p-bottom_medium"></div>
34</template>

次の例は、カスタムプロパティエディタの UI を示しています。

[レコードの選択] アクションのカスタムプロパティエディタ

カスタムプロパティエディタが初期化されると、JavaScript クラスは Flow Builder からフローメタデータのコピーを受信します。システム管理者がカスタムプロパティエディタで値を変更すると、カスタムプロパティエディタはイベントをディスパッチして変更を Flow Builder に反映します。

@api プロパティを使用して、フローのデータを取得します。イベントを使用して、実行時のフローの変更をレポートします。

Note

1// selectRecordEditor.js
2import { LightningElement, api } from "lwc";
3
4export default class SelectRecordEditor extends LightningElement {
5  @api
6  inputVariables;
7
8  @api
9  genericTypeMappings;
10
11  @api
12  builderContext;
13
14  get inputValue() {
15    const param = this.inputVariables.find(({ name }) => name === "inputCollection");
16    return param && param.value;
17  }
18
19  get inputType() {
20    const type = this.genericTypeMappings.find(({ typeName }) => typeName === "T__inputCollection");
21    return type && type.typeValue;
22  }
23
24  get outputType() {
25    const type = this.genericTypeMappings.find(({ typeName }) => typeName === "U__outputMember");
26    return type && type.typeValue;
27  }
28
29  get typeOptions() {
30    return [
31      { label: "Account", value: "Account" },
32      { label: "Case", value: "Case" },
33      { label: "Lead", value: "Lead" },
34    ];
35  }
36
37  get valueOptions() {
38    const variables = this.builderContext.variables;
39    return variables.map(({ name }) => ({
40      label: name,
41      value: name,
42    }));
43  }
44
45  handleInputTypeChange(event) {
46    if (event && event.detail) {
47      const newValue = event.detail.value;
48      const typeChangedEvent = new CustomEvent(
49        "configuration_editor_generic_type_mapping_changed",
50        {
51          bubbles: true,
52          cancelable: false,
53          composed: true,
54          detail: {
55            typeName: "T__inputCollection",
56            typeValue: newValue,
57          },
58        },
59      );
60      this.dispatchEvent(typeChangedEvent);
61    }
62  }
63
64  handleOutputTypeChange(event) {
65    if (event && event.detail) {
66      const newValue = event.detail.value;
67      const typeChangedEvent = new CustomEvent(
68        "configuration_editor_generic_type_mapping_changed",
69        {
70          bubbles: true,
71          cancelable: false,
72          composed: true,
73          detail: {
74            typeName: "U__outputMember",
75            typeValue: newValue,
76          },
77        },
78      );
79      this.dispatchEvent(typeChangedEvent);
80    }
81  }
82
83  handleValueChange(event) {
84    if (event && event.detail) {
85      const newValue = event.detail.value;
86      const valueChangedEvent = new CustomEvent("configuration_editor_input_value_changed", {
87        bubbles: true,
88        cancelable: false,
89        composed: true,
90        detail: {
91          name: "inputCollection",
92          newValue,
93          newValueDataType: "reference",
94        },
95      });
96      this.dispatchEvent(valueChangedEvent);
97    }
98  }
99}

Flow Builder には、カスタムプロパティエディタと通信するための JavaScript インターフェースがあります。この JavaScript クラスは、inputVariables、builderContext および genericTypeMappings インターフェースを使用します。

カスタムプロパティエディタが初期化されると、inputVariables は、Flow Builder から呼び出し可能なアクションの入力変数の値を受信します。

inputVariables データ構造には、各入力変数の名前、値、データ型が含まれます。

1[
2  {
3    name: "inputType",
4    value: "Account",
5    valueDataType: "Account",
6  },
7];

get inputValue() メソッドは、カスタムプロパティエディタで使用する各入力変数の値を取得します。

genericTypeMappings インターフェースは、Flow Builder から呼び出し可能なアクションの汎用 sObject データ型である入力変数の値を受信します。

データ構造には、各入力の名前と値が含まれます。typeName は、メソッド内の @InvocableVariable アノテーションで定義されている汎用 sObject 入力の名前と一致する必要があります (例: ’T__inputCollection’)。T__ は入力名の先頭に、U__ は出力名の先頭に自動的に追加されます。typeValue は汎用 sObject 入力の特定値です (例: Account)。

1[
2  {
3    typeName: "T__inputCollection",
4    typeValue: "Account",
5  },
6];

get inputType() と get outputType() メソッドは、カスタムプロパティエディタで使用する汎用 sObject データ型である各入力パラメータの値を取得します。

get typeOptions() メソッドは、カスタムプロパティエディタで使用する各オブジェクト入力オプションの表示ラベルと値を取得します。

builderContext インターフェースは、フローの要素およびリソースに関すデータを提供します。

builderContext データ構造にはフローの要素およびリソースが含まれます。

get valueOptions() メソッドは、呼び出し可能なアクションの入力パラメータに対するカスタムプロパティエディタの入力値のオプションとして、変数からのデータを使用します。

システム管理者がカスタムプロパティエディタで [レコード変数のオブジェクト] の入力の値を入力すると、handleInputTypeChange メソッドは configuration_editor_generic_type_mapping_changed イベントを Flow Builder にディスパッチします。Flow Builder は、フローでイベントを受信して値を更新します。

システム管理者がカスタムプロパティエディタで [出力を保存するためのオブジェクト] の入力の値を入力すると、handleOutputTypeChange メソッドは configuration_editor_generic_type_mapping_changed イベントを Flow Builder にディスパッチします。Flow Builder は、フローでイベントを受信して値を更新します。

システム管理者がカスタムプロパティエディタで [レコード変数] の入力の値を入力すると、handleValueChange メソッドは configuration_editor_input_value_changed イベントを Flow Builder にディスパッチします。Flow Builder は、フローでイベントを受信して値を更新します。

selectRecordEditor の設定ファイルは次のようになります。

1<!--selectRecordEditor.js-meta.xml-->
2<?xml version="1.0" encoding="UTF-8"?>
3<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
4    <apiVersion>50.0</apiVersion>
5    <!--isExposed can be true or false-->
6    <isExposed>true</isExposed>
7</LightningComponentBundle>

関連トピック

The Japanese Summer '24 guide is now live

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