Query Docs
Guides & Concepts
- Important Defaults
- Queries
- Query Keys
- Query Functions
- Query Options
- Network Mode
- Parallel Queries
- Dependent Queries
- Background Fetching Indicators
- Window Focus Refetching
- Polling
- Disabling/Pausing Queries
- Query Retries
- Paginated Queries
- Infinite Queries
- Initial Query Data
- Placeholder Query Data
- Mutations
- Query Invalidation
- Invalidation from Mutations
- Updates from Mutation Responses
- Optimistic Updates
- Query Cancellation
- Scroll Restoration
- Filters
- Performance & Request Waterfalls
- Prefetching & Router Integration
- Server Rendering & Hydration
- Advanced Server Rendering
- Caching
- Render Optimizations
- Default Query Fn
- Suspense
- Testing
- Does this replace [Redux, MobX, etc]?
- Migrating to v3
- Migrating to v4
- Migrating to v5
ESLint
AI/LLM: This documentation page is available in plain markdown format at/query/latest/docs/eslint/mutation-property-order.md
ESLint
Ensure correct order of inference-sensitive properties in useMutation()
For the following functions, the property order of the passed in object matters due to type inference:
- useMutation()
The correct property order is as follows:
- onMutate
- onError
- onSettled
All other properties are insensitive to the order as they do not depend on type inference.
Rule Details#
Examples of incorrect code for this rule:
tsx
/* eslint "@tanstack/query/mutation-property-order": "warn" */
import { useMutation } from '@tanstack/react-query'
const mutation = useMutation({
mutationFn: () => Promise.resolve('success'),
onSettled: () => {
results.push('onSettled-promise')
return Promise.resolve('also-ignored') // Promise<string> (should be ignored)
},
onMutate: async () => {
results.push('onMutate-async')
await sleep(1)
return { backup: 'async-data' }
},
onError: async () => {
results.push('onError-async-start')
await sleep(1)
results.push('onError-async-end')
},
})Examples of correct code for this rule:
tsx
/* eslint "@tanstack/query/mutation-property-order": "warn" */
import { useMutation } from '@tanstack/react-query'
const mutation = useMutation({
mutationFn: () => Promise.resolve('success'),
onMutate: async () => {
results.push('onMutate-async')
await sleep(1)
return { backup: 'async-data' }
},
onError: async () => {
results.push('onError-async-start')
await sleep(1)
results.push('onError-async-end')
},
onSettled: () => {
results.push('onSettled-promise')
return Promise.resolve('also-ignored') // Promise<string> (should be ignored)
},
})Attributes#
- ✅ Recommended
- 🔧 Fixable