This rule warns about deprecated useQuery options which will be removed in TanStack Query v5.
Examples of incorrect code for this rule:
/* eslint "@tanstack/query/no-deprecated-options": "error" */
useQuery({
queryKey: ['todo', todoId],
queryFn: () => api.getTodo(todoId),
onSuccess: () => {},
})
useQuery({
queryKey: ['todo', todoId],
queryFn: () => api.getTodo(todoId),
onError: () => {},
})
useQuery({
queryKey: ['todo', todoId],
queryFn: () => api.getTodo(todoId),
onSettled: () => {},
})
useQuery({
queryKey: ['todo', todoId],
queryFn: () => api.getTodo(todoId),
isDataEqual: (oldData, newData) => customCheck(oldData, newData),
})
/* eslint "@tanstack/query/no-deprecated-options": "error" */
useQuery({
queryKey: ['todo', todoId],
queryFn: () => api.getTodo(todoId),
onSuccess: () => {},
})
useQuery({
queryKey: ['todo', todoId],
queryFn: () => api.getTodo(todoId),
onError: () => {},
})
useQuery({
queryKey: ['todo', todoId],
queryFn: () => api.getTodo(todoId),
onSettled: () => {},
})
useQuery({
queryKey: ['todo', todoId],
queryFn: () => api.getTodo(todoId),
isDataEqual: (oldData, newData) => customCheck(oldData, newData),
})
Examples of correct code for this rule:
useQuery({
queryKey: ['todo', todoId],
queryFn: () => api.getTodo(todoId),
})
useQuery({
queryKey: ['todo', todoId],
queryFn: () => api.getTodo(todoId),
structuralSharing: (oldData, newData) =>
customCheck(oldData, newData)
? oldData
: replaceEqualDeep(oldData, newData),
})
useQuery({
queryKey: ['todo', todoId],
queryFn: () => api.getTodo(todoId),
})
useQuery({
queryKey: ['todo', todoId],
queryFn: () => api.getTodo(todoId),
structuralSharing: (oldData, newData) =>
customCheck(oldData, newData)
? oldData
: replaceEqualDeep(oldData, newData),
})
If you don't plan to upgrade to TanStack Query v5, then you will not need this rule.
“This course is the best way to learn how to use React Query in real-world applications.”—Tanner LinsleyCheck it out