のイベントペイロード UI ビルダー

  • リリースバージョン: Yokohama
  • 更新日 2025年01月30日
  • 所要時間:3分
  • イベントペイロードを使用して、データをアクションにリンクします。

    イベントペイロードは、選択したイベントがトリガーされたときにコンポーネントによって送信されるデータです。イベントによって送信されるデータには、イベントのタイプ、タイムスタンプ、ユーザーアクション、または SysID などのリソースデータを含めることができます。UI ビルダー でイベントペイロードを使用して、ページ上のコンポーネント間で情報を共有できます。

    このペイロードデータは、結果のインタラクションを出力されたデータにリンクできるように、イベントハンドラーを構成するときに使用できます。たとえば、SysID をページ上の他のコンポーネントに渡して、指定したレコードに関連する情報を表示できます。

    選択したコンポーネントで利用可能なイベントペイロードを含む赤色のボックス。

    各コンポーネントとイベントには、ペイロードオプションの一意のセットがあります。イベントペイロードが各コンポーネントに対して適切に定義されていない可能性があります。その場合は、 console.log(event.payload) などのペイロードをコンソールがログに記録するようにクライアントスクリプトを定義します。

    ペイロードを使用してイベントを作成し、コンポーネント間で情報を共有する

    UI ビルダー でイベントペイロードを使用して、ページ上のコンポーネント間で情報を共有します。

    始める前に

    必要なロール:ui_builder_admin

    手順

    1. 次のように移動する。 All (すべて) > Now Experience フレームワーク > UI ビルダー.
    2. 作業するエクスペリエンスを開くか、選択してエクスペリエンスを作成します 作成/挿入 > エクスペリエンス.
    3. ページを作成するか、開きます。
      UI ビルダー でページを作成する方法の詳細については、「UI ビルダーでのページの作成」を参照してください。
    4. データビジュアル化コンポーネントなど、イベントを持つコンポーネントを追加します。
      コンポーネントのページへの追加に関する詳細については、「コンポーネントの追加と構成」を参照してください。
    5. コンポーネントにイベントハンドラーを追加するには、[イベント] タブを選択します。
      コンポーネントにイベントハンドラーを追加する方法の詳細については、「「Manage actions in UI Builder pages (UI ビルダーページでのアクションの管理)」」を参照してください。
      1. コンポーネントのイベントハンドラーを設定するプロセスを開始するには、[ イベントマッピングの追加] をクリックします。
        [イベントマッピングを追加] オプションを指す矢印
      2. 構成するイベントマッピングをリストから選択します。
        データ可視化コンポーネントで利用可能なイベントマッピングのリスト。
      3. [Continue (続行)] を選択します。
      4. [イベントハンドラープレビュー] セクションで、コンポーネントにバインドするイベントハンドラーを選択します。
        リスト内の行がクリックされたときにアラート通知をクリアします。リストから選択されたクライアントステータスパラメーターハンドラーを更新します。
      5. [Continue (続行)] を選択します。
      6. [クライアントステータスパラメーター名] ドロップダウンから [新しいクライアントステータスを作成] パラメーターを選択します。
      7. [名前] フィールドに名前を入力します。
      8. [タイプ] ドロップダウンからクライアントステータスパラメーターのタイプを選択します。
      9. [初期値] フィールドに値を入力します。
      10. [ イベントのトリガー後に使用する値 (Value to use after triggering event )] フィールドで、データをバインドアイコンを選択します。
        [イベントのトリガー後に使用する値 (Value to use after triggering event)] フィールドの [データをバインド] アイコンを指す矢印。
      11. トリガーされたイベントにバインドする値を選択します。
        データモーダルをバインド
      12. [適用] を選択します。
      13. [Add] を選択します。
        データハンドラーは、[イベント] タブのイベントマッピングの下に表示されます。

        データ可視化コンポーネント用に構成されたイベントハンドラーを指す矢印。

    6. クライアントステータスパラメーターをバインドするコンポーネントを選択します。この例では、見出しコンポーネントを使用します。
    7. クライアントステータスパラメーターのバインド先のフィールドで、[データをバインド] アイコンを選択します。
      見出しコンポーネントの [ラベル] フィールドにある [データをバインド] アイコンを指す矢印。
    8. [クライアントステータス] を選択します。
    9. バインドするクライアントステータスパラメーターの横にある矢印を選択します。
      クライアントステータスパラメーターをラベルフィールドにバインドする矢印を指す矢印。
    10. [適用] を選択します。
    11. [Save (保存)] をクリックする。
    12. [ プレビュー ] を選択して、構成したイベントであることをテストします。