TanStack Query · límite API
TanStack Query snake_case ↔ camelCase
La caché de TanStack Query debe guardar la forma que realmente usa la aplicación. Normaliza en queryFn y mutationFn.
Devuelve datos camelCase desde la query function
import { useQuery } from "@tanstack/react-query"
import { apiJson } from "./api"
type UserProfile = {
userId: number
firstName: string
}
export function useUserProfile(userId: number) {
return useQuery({
queryKey: ["user-profile", userId],
queryFn: () => apiJson<UserProfile>(`/users/${userId}`),
})
}Si queryFn devuelve datos normalizados, todos los componentes con la misma query key ven la misma forma.
Convierte variables de mutation en el límite request
import { useMutation, useQueryClient } from "@tanstack/react-query"
import { apiJson } from "./api"
type UpdateUser = {
firstName: string
}
export function useUpdateUser(userId: number) {
const queryClient = useQueryClient()
return useMutation({
mutationFn: (input: UpdateUser) =>
apiJson(`/users/${userId}`, {
method: "PATCH",
body: input,
}),
onSuccess: (data) => {
queryClient.setQueryData(["user-profile", userId], data)
},
})
}Mantén inputs camelCase en la app y conviértelos al contrato snake_case dentro de la función de solicitud.
Consideraciones de producción
- TanStack Query v5 usa la forma de un único objeto de opciones para useQuery y useMutation.
- Guarda una sola forma canónica y no mezcles snake_case crudo con camelCase bajo la misma query key.
- Normaliza la respuesta de mutation antes de escribirla en caché.
- La conversión de case es una preocupación de transporte; los componentes consumen datos ya normalizados.
Probar el límite JSON online
Prueba objetos anidados, arrays, exclusiones, stop paths, prefijos, colisiones y diff de claves antes de implementar.
Suelta un archivo .json o elige uno de tu dispositivo
Los archivos se leen solo en tu navegador. Tamaño máximo: 5 MB.
JSON convertido
{
"userProfile": {
"firstName": "Ada",
"createdAt": "2026-09-12"
}
}El análisis, lectura de archivos, formato y conversión se ejecutan localmente en tu navegador. El JSON no se envía a un servidor de conversión.