Los datos provienen del backend y puedo verlos en la pestaña de red, pero la consulta de reacción está devolviendo datos indefinidos, ni siquiera está reaccionando con los datos porque devuelve una carga y recuperación falsas en la consola, y el devtools está configurado para fresco(1) . funcionaba antes, pero ahora parece que no puede encontrar una solución.
Esta es mi aplicación.js:
const queryClient = new QueryClient({ defaultOptions: { queries: { staleTime: Infinity, cacheTime: 0, }, }, }); function App() { return ( <QueryClientProvider client={queryClient} contextSharing={true}> <PrivateRoute exact path="/dashboard/snp/match" component={MatchedSequences} /> <ReactQueryDevtools initialIsOpen /> </QueryClientProvider> ); }exportar la aplicación predeterminada;
Este es mi componente:
const queryClient = useQueryClient(); const [showQuery, setShowQuery] = useState(false); const [showSequence, setShowSequence] = useState(false); const { isLoading, isFetching, error, data, status } = useQuery( "dn", () => { fetch("/api/users/find").then((res) => { return res.json(); }); }, { keepPreviousData: false }, ); console.log({ isLoading, isFetching }); console.log("error", error); console.log({ data });Estoy usando reaccionar Query versión 3.34.
Su función de consulta (el segundo parámetro para useQuery ) no devuelve nada:
() => { fetch("/api/users/find").then((res) => { const result = res.json(); console.log({result}); return result; }); },si usa corchetes para la función de flecha, necesita la palabra clave de retorno:
() => { return fetch("/api/users/find").then((res) => { const result = res.json(); console.log({result}); return result; }); },alternativamente, puede usar el retorno implícito de la función de flecha, pero luego debe omitir las llaves:
() => fetch("/api/users/find").then((res) => { const result = res.json(); console.log({result}); return result; });actualice su código para agregar el registro dentro de la búsqueda, así:
const queryClient = useQueryClient(); const [showQuery, setShowQuery] = useState(false); const [showSequence, setShowSequence] = useState(false); const { isLoading, isFetching, error, data, status } = useQuery( "dn", () => { fetch("/api/users/find").then((res) => { const result = res.json(); console.log({result}); return result; }); }, { keepPreviousData: false }, ); console.log({ isLoading, isFetching }); console.log("error", error); console.log({ data }); ¿Qué valor tiene el result ?