例: 画面コンポーネントの汎用 sObject 入力

この例では、汎用 sObject 入力値を使用するカスタムフロー画面コンポーネントのカスタムプロパティエディタを作成します。システム管理者は選択リスト項目を使用して、レコード変数のオブジェクトとレコード変数に画面コンポーネントの入力値を設定します。ユーザがこの例のフローを実行すると、画面コンポーネントにレコードのコレクションの最初のレコードが表示されます。

次の HTML、JavaScript、設定ファイルは、displayRecord カスタムフロー画面コンポーネントを定義します。

JavaScript クラスは、inputValue 公開プロパティを定義します。

Flow Builder で inputValue 公開プロパティを表示するには、設定ファイルで定義します。プロパティを汎用 sObject データ型として定義するには、propertyType サブタグを定義します。サブタグは汎用 sObject データ型を拡張します。inputValue の type 属性は、propertyType サブタグの name 属性を参照します。たとえば、propertyType name="T" の場合は property type="{T}" となります。property サブタグの type 属性は中括弧で囲む必要があります。プロパティを汎用 sObject コレクションデータ型として定義するには、[] を追加します (例: property type="{T[]}")。

role 属性は、プロパティでフローからの入力を受信することができるかどうかを決定します。デフォルト値は、inputAndOutput です。プロパティを入力のみまたは出力のみで使用できるようにするには、role 属性を inputOnly または outputOnly に設定します。

設定ファイルで、configurationEditor 属性を使用してカスタムプロパティエディタを登録します。

組織にカスタム名前空間がなければ、c 名前空間を使用します。組織にカスタム名前空間がある場合は、その名前空間を使用してください。

次の HTML、JavaScript、設定ファイルは、displayRecord コンポーネントのカスタムプロパティエディタを定義します。

このカスタムプロパティエディタの HTML テンプレートは、コンボボックスベースの Lightning Web コンポーネントを使用する UI を定義します。

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

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

カスタムプロパティエディタが初期化されると、inputVariables は Flow Builder から画面コンポーネントの公開プロパティの値を受信します。

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

get inputValue() は、カスタムプロパティエディタで使用する inputValue プロパティの値を取得します。

genericTypeMappings インターフェースは、Flow Builder から画面スクリーンの汎用 sObject データ型である入力変数の値を受信します。

データ構造には、各入力の名前と値が含まれます。typeName は、汎用 sObject 入力の名前です (例: 'T')。typeValue は、汎用 sObject 入力の特定値です (例: Account)。

get inputType() は、カスタムプロパティエディタで使用する inputValue プロパティのデータ型を取得します。

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

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

get valueOptions() メソッドは、画面コンポーネントの入力に対するカスタムプロパティエディタの入力値のオプションとして、variables からのデータを使用します。

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

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

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

関連トピック

• カスタムプロパティエディタの JavaScript インターフェース
• XML 設定ファイルの要素