useMutationState
useMutationState ist ein Hook, der Ihnen Zugriff auf alle Mutationen im MutationCache gibt. Sie können filter übergeben, um Ihre Mutationen einzugrenzen, und select, um den Mutationsstatus zu transformieren.
Beispiel 1: Alle Variablen aller laufenden Mutationen abrufen
tsx
import { useMutationState } from '@tanstack/vue-query'
const variables = useMutationState({
filters: { status: 'pending' },
select: (mutation) => mutation.state.variables,
})
import { useMutationState } from '@tanstack/vue-query'
const variables = useMutationState({
filters: { status: 'pending' },
select: (mutation) => mutation.state.variables,
})
Beispiel 2: Alle Daten für bestimmte Mutationen über den mutationKey abrufen
tsx
import { useMutation, useMutationState } from '@tanstack/vue-query'
const mutationKey = ['posts']
// Some mutation that we want to get the state for
const mutation = useMutation({
mutationKey,
mutationFn: (newPost) => {
return axios.post('/posts', newPost)
},
})
const data = useMutationState({
// this mutation key needs to match the mutation key of the given mutation (see above)
filters: { mutationKey },
select: (mutation) => mutation.state.data,
})
import { useMutation, useMutationState } from '@tanstack/vue-query'
const mutationKey = ['posts']
// Some mutation that we want to get the state for
const mutation = useMutation({
mutationKey,
mutationFn: (newPost) => {
return axios.post('/posts', newPost)
},
})
const data = useMutationState({
// this mutation key needs to match the mutation key of the given mutation (see above)
filters: { mutationKey },
select: (mutation) => mutation.state.data,
})
Beispiel 3: Auf die neuesten Mutationsdaten über den mutationKey zugreifen. Jeder Aufruf von mutate fügt dem Mutations-Cache für gcTime Millisekunden einen neuen Eintrag hinzu.
Um auf den neuesten Aufruf zuzugreifen, können Sie das letzte Element prüfen, das useMutationState zurückgibt.
tsx
import { useMutation, useMutationState } from '@tanstack/vue-query'
const mutationKey = ['posts']
// Some mutation that we want to get the state for
const mutation = useMutation({
mutationKey,
mutationFn: (newPost) => {
return axios.post('/posts', newPost)
},
})
const data = useMutationState({
// this mutation key needs to match the mutation key of the given mutation (see above)
filters: { mutationKey },
select: (mutation) => mutation.state.data,
})
// Latest mutation data
const latest = data[data.length - 1]
import { useMutation, useMutationState } from '@tanstack/vue-query'
const mutationKey = ['posts']
// Some mutation that we want to get the state for
const mutation = useMutation({
mutationKey,
mutationFn: (newPost) => {
return axios.post('/posts', newPost)
},
})
const data = useMutationState({
// this mutation key needs to match the mutation key of the given mutation (see above)
filters: { mutationKey },
select: (mutation) => mutation.state.data,
})
// Latest mutation data
const latest = data[data.length - 1]
Optionen
- optionen
- filters?: MutationFilters: Mutationsfilter
- select?: (mutation: Mutation) => TResult
- Verwenden Sie dies, um den Mutationsstatus zu transformieren.
- queryClient?: QueryClient
- Verwenden Sie dies, um einen benutzerdefinierten QueryClient zu verwenden. Andernfalls wird der aus dem nächsten Kontext verwendet.
Gibt zurück
- Array<TResult>
- Wird ein Array von dem sein, was select für jede übereinstimmende Mutation zurückgibt.
