useMutationState

function useMutationState<TResult>(
   host,
   options,
queryClient?): MutationStateAccessor<TResult>;

정의 위치: packages/lit-query/src/useMutationState.ts:192

일치하는 뮤테이션에서 상태를 선택하는 Lit 반응형 컨트롤러를 생성합니다 뮤테이션 캐시에 있습니다.

options.filters가 함수인 경우 호스트 업데이트 중에 다시 읽으므로 선택 항목은 반응형 호스트 상태를 따를 수 있습니다. queryClient가 생략되면, 컨트롤러는 가장 가까이 연결된 곳에서 클라이언트를 확인합니다 QueryClientProvider.

타입 매개변수

TResult

TResult = MutationState<unknown, unknown, unknown, unknown>

매개변수

host

ReactiveControllerHost

뮤테이션 캐시를 소유하는 Lit 반응형 컨트롤러 host입니다 구독.

옵션

MutationStateOptions<TResult> = {}

뮤테이션 상태 필터와 선택적 선택자입니다.

queryClient?

QueryClient

선택적인 명시적 query client입니다. 다음을 위해 이를 제공하십시오 Lit 컨텍스트에서 클라이언트를 확인하면 안 되는 컨트롤러입니다.

반환값

MutationStateAccessor<TResult>

선택된 뮤테이션 상태 배열의 접근자입니다.

예시

import { LitElement, html } from 'lit'
import { useMutationState } from '@tanstack/lit-query'

class PendingUploads extends LitElement {
  private readonly uploads = useMutationState(this, {
    filters: { mutationKey: ['upload'], status: 'pending' },
    select: (mutation) => mutation.state.variables as File,
  })

  render() {
    return html`<span>${this.uploads().length} uploads pending</span>`
  }
}