TanStackT
TanStack•13mo ago•
5 replies
inadequate-blush

Best Practice for mutationFn Return Value When Not Using Axios

I'm working with mutations in React Query and need clarification on the optimal return value from mutationFn. The type definition shows: mutationFn: (variables: TVariables) => Promise<TData>

My main question is: Should I return the promise directly (e.g., return response.json()) or should I await response.json() first and then return the final data inside mutationFn?

const mutationFn = async (variables) => {
  const response = await fetch('/api/endpoint', {
    method: 'POST',
    body: JSON.stringify(variables)
  })
  return await response.json();
  // vs
  return response.json();
}


I'm asking this question because I’ve noticed that examples on the internet differ on how they return data in a mutationFn. What are the practical and logical differences between these approaches? Are there any implications for error handling or the way React Query processes the mutation results?

Thanks in advance for any insights!
Was this page helpful?