useExecuteActionLazy

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

基本的な使い方

const App = () => {
    const [execute, { data, loading, error }] = useExecuteActionLazy("action-id");
    
    const handleClick = () => {
        execute([{
            name: "param1",
            value: "value1"
        }, {
            name: "param2",
            value: "value2"
        }]);
    }

    return (
        <div>
            <button onClick={handleClick}>Execute Action</button>
            {loading && <LoadingIndicator />}
            {data && <Table rows={data.results[0].success ?? []}/>}
        </div>
    )
}

詳細なインターフェース

引数

識別子	型	説明	例
actionId	文字列	実行するアクションのID。アクションは、アプリケーションの特定の機能を実行するための識別子です。	c3hc2ii23akg0sokf9j0

戻り値

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