ビュー
関数
useExecuteActionLazy

useExecuteActionLazy

useExecuteActionLazyはアクションの実行を遅延させるためのフックです。このフックはアクションの識別子を引数として受け取り、そのアクションの実行を開始する関数とアクションの実行状態を返します。

基本的な使い方

const App = () => {
  const [execute, { data, loading, error }] = useExecuteActionLazy("action-id");
 
  const handleClick = () => {
    execute({
      company_name: "株式会社ベースマキナ",
      user_id: 123,
      checked: true,
      created: "2023-01-01",
    });
  };
 
  return (
    <div>
      <button onClick={handleClick}>Execute Action</button>
      {loading && <LoadingIndicator />}
      {data && <Table rows={data.results[0].success ?? []} />}
    </div>
  );
};

詳細なインターフェース

引数

引数名型説明例
actionIdstring実行するアクションのID、または識別子。c3hc2ii23akg0sokf9j0, get-user

戻り値

プロパティ名型説明例
executeasync function引数としてアクションのパラメータを受け取り、アクションを実行する関数。dataをプロパティに持つオブジェクトのPromiseを返します。-
stateobjectアクションの実行状態を表すオブジェクト。このオブジェクトはloading、data、errorの3つのプロパティを持ちます。-
state.loadingbooleanアクションが現在実行中かどうかを示すブール値。true
state.dataobjectアクションの実行結果。このオブジェクトはresultsという名前の配列を持っておりsuccess と failure のプロパティが含まれます。{"results":[{"success":[{"id":1,"name":"山田太郎"}]}]}
state.errorobjectアクションの実行中に発生したエラー。-

なおexecute関数の引数のパラメータは、キーがパラメータ名、値がパラメータに渡す値のオブジェクト（例：{ username: 'JohnDoe' }）となり、パラメータの入力値の種類ごとにプロパティの値に渡せる値の型は以下です。

入力値の種類型説明例
テキストstring-{ company_name: '株式会社ベースマキナ' }
数値number | null-{ user_id: 123 }
日付Date | string | number | nullstringはDate型に変換できる値、numberはUnixTimestamp (秒)を入力してください。{ created: '2023-01-01', updated: new Date(), deleted: 1609459200 }
ファイルFile | null-{ upload_text: new File(['test'], 'test.txt', { type: 'text/plain' }) }
真偽値boolean-{ checked: true }
JSON値string | number | Date | nullJSON値の種類ごとに型が異なります。
テキストならstring | null、数値ならnumber | null、日付ならstring | number | Date | nullを渡せます。
日付の場合stringはDate型に変換できる値、numberはUnixTimestamp (秒)を入力してください。　		{ company_name: '株式会社ベースマキナ', user_id: 123, created: '2023-01-01', deleted: null }
SQLstring-{ query: 'SELECT * FROM users;' }
システム値string-{ offset: '20' }
配列Array各要素の種類の型は、各入力値の種類の型と同じです。{ user_ids: [10, 11, 12] }
タプルArray各要素の種類の型は、各入力値の種類の型と同じです。{ id_and_name: [123, 'taro'] }
useExecuteActionexecuteAction