Auf dieser Seite
Verhindern, dass das Ergebnis von Query-Hooks direkt in ein React-Hook-Abhängigkeitsarray gesetzt wird
Das von den folgenden Query-Hooks zurĂĽckgegebene Objekt ist nicht referenziell stabil
- useQuery
- useSuspenseQuery
- useQueries
- useSuspenseQueries
- useInfiniteQuery
- useSuspenseInfiniteQuery
- useMutation
Das von diesen Hooks zurückgegebene Objekt sollte nicht direkt in das Abhängigkeitsarray eines React-Hooks (z.B. useEffect, useMemo, useCallback) gesetzt werden. Destrukturieren Sie stattdessen den Rückgabewert des Query-Hooks und übergeben Sie die destrukturierten Werte in das Abhängigkeitsarray des React-Hooks.
Regeldetails
Beispiele fĂĽr falschen Code fĂĽr diese Regel
tsx
/* eslint "@tanstack/query/no-unstable-deps": "warn" */
import { useCallback } from 'React'
import { useMutation } from '@tanstack/react-query'
function Component() {
const mutation = useMutation({ mutationFn: (value: string) => value })
const callback = useCallback(() => {
mutation.mutate('hello')
}, [mutation])
return null
}
/* eslint "@tanstack/query/no-unstable-deps": "warn" */
import { useCallback } from 'React'
import { useMutation } from '@tanstack/react-query'
function Component() {
const mutation = useMutation({ mutationFn: (value: string) => value })
const callback = useCallback(() => {
mutation.mutate('hello')
}, [mutation])
return null
}
Beispiele fĂĽr korrekten Code fĂĽr diese Regel
tsx
/* eslint "@tanstack/query/no-unstable-deps": "warn" */
import { useCallback } from 'React'
import { useMutation } from '@tanstack/react-query'
function Component() {
const { mutate } = useMutation({ mutationFn: (value: string) => value })
const callback = useCallback(() => {
mutate('hello')
}, [mutate])
return null
}
/* eslint "@tanstack/query/no-unstable-deps": "warn" */
import { useCallback } from 'React'
import { useMutation } from '@tanstack/react-query'
function Component() {
const { mutate } = useMutation({ mutationFn: (value: string) => value })
const callback = useCallback(() => {
mutate('hello')
}, [mutate])
return null
}
Attribute
- âś… Empfohlen
- 🔧 Behebbar
