Tengo un gancho personalizado useSubjects para obtener los datos de mi punto final de API que utiliza useSWR.

 import axios from '@/lib/axios' import useSWR from 'swr' /** * Fetcher Function for SWR */ const fetchSubjects = async url => { console.log("url = " + url) await axios .get(url) .then(res => res.data) .catch(error => { if (error.response.status !== 409) throw error }) } export const useSubjects = (id = -1) => { // /** // * swr hook for fetching subjects // */ const { data: subjects, error, mutate } = useSWR( id > 0 ? `api/get-subject-branch/${id}` : 'api/get-subject-branches', fetchSubjects, ) return { subjects, error, } }

El enlace useSubjects se usa más tarde en uno de mis componentes.

 import { useEffect } from 'react' import { useSubjects } from '@/hooks/subjects' const myComponent = () => { const { subjects, error } = useSubjects() useEffect(() => { console.log(subjects) }, [subjects]) return ( <> <div>My Content</div> </> ) }

Sin embargo, la constant {subjects} que debe contener los datos obtenidos del enlace useSWR parece permanecer undefined

He probado mi punto final de API usando la solicitud GET directa axios y extrae con éxito los datos de mi API.

De hecho, he escrito console.log(res.data) en mi función de fetchSubjects fetchSubjects que parece obtener los datos. Pero de alguna manera no está configurando la const {data: subjects, ...} que debería contener los datos obtenidos de la API y permanece undefined