Tengo un gancho personalizado llamado useAxios . En realidad, se trata de un envoltorio para un gancho useQuery que devuelve la instancia de axios almacenada en caché o crea una nueva al actualizar el JWT.

Ahora, si creo una mutación que se basa en esta instancia de axios:

 export function useExampleMutation() { const axios = useAxios(); return useMutation((thing) => axios.post(`/do-something-cool/${thing}`) ) }

Ahora, según tengo entendido, cuando la uso, la función mutar es referencialmente estable:

 export function ExampleComponent() { const exampleMutation = useExampleMutation(); useEffect(() => { // ... }, [exampleMutation.mutate]) // // ^^^^^^ This is referentially stable return <div>...</div> }

Por lo tanto, el gancho useEffect no se activará con cada renderizado.

Pero no me gustaría que este fuera el caso si el token se actualiza y obtengo una nueva instancia de axios. Entonces, ¿cómo especificaría que debo obtener una nueva instancia siempre que sea una devolución de llamada normal?

 export function useExampleCallback() { const axios = useAxios(); return useCallback((thing) => axios.post(`/do-something-cool/${thing}`), [axios]) }