Skip to main content

useCsRqMutateLoadEvent

useCsRqMutateLoadEvent は、API 呼び出し方式が TanStack Query および Orval（シンプル版）に対応する更新系 API ロードイベントを初期化するためのフックです。 複雑な検索条件などがあり POST でリクエストを渡して検索することを想定したロードイベントです。

シグネチャ​

useCsRqMutateLoadEvent
 <TApiRequest, TApiResponse, TApiError, TContext = unknown>
(mutationResult: UseMutationResult
 <TApiResponse, TApiError, TApiRequest, TContext>,
 request: TApiRequest):
CsRqMutateLoadEvent
 <TApiRequest, TApiResponse, TApiError, TContext>

引数​

引数名必須型説明
mutationResult〇UseMutationResult<TApiResponse, TApiError, TApiRequest, TContext>*¹TanStack Query の useMutate を使ったカスタムフックを指定します。
request〇TApiRequestAPI リクエストのパラメータを指定します。

*1：UseMutationResultは API のリクエスト、レスポンス、エラー、コンテキストに関する情報を保持するTanStack Queryの組み込みの型定義です。

返り値​

API のレスポンス、成功・失敗のステータスなどの情報が含まれるCsRqMutateLoadEventクラスのインスタンスを返します。

使用例​

export const useTodoComplexSearchView = (): TodoComplexSearchView => {
  const title = useCsInputTextItem("検索するタイトル", useInit(""), stringRule(false));
  const description = useCsTextAreaItem("検索する説明文", useInit(""), stringRule(false));

  return useCsView(
    {
      title: title,
      description: description,
      loadEvent: useCsRqMutateLoadEvent(
        useComplexSearchTodo(), // useMutateを返すカスタムフック
        { title: title.value ?? "", description: description.value ?? "" }
       ), // ロードイベントにリクエストを設定
    }
  );
};