Accessing Object get undefined
Currently i'm accessing the object through this it shown
But, whenever i try to access the error 500 Cannot read properties of undefined (reading 'data') is all i got. am i missing something?
But, whenever i try to access the error 500 Cannot read properties of undefined (reading 'data') is all i got. am i missing something?
20 Replies
@less show us your call.
If you don't await
useFetch
, data
will be null before the call has been made
Here's my call
of your
script setup
block is this on top-level?
.then((res) => (data = res.data.attributes))
data is no ref here and thus not reactivePardon for my mistakes, but i've declared the data on top of the $fetch call
I've been accessing others response and it works just fine, like :
and , just for the jumbotronImage , it kinda breaking up when accesing the {{data.jumbtronImage.data}}
@less can you try
useFetch
instead? π€
const { data } = await useFetch('http://localhost:1337/api/landing-page?populate=*')
(and then use data.data.attributes
or write a computed)
yes, because data
is an empty object. {}.whatever
will be undefined, but {}.whatever.x
will throw because {}.whatever
is undefined and undefined.x
will throwThankyou, sir for the help. ill give it a try to use useFetch
No problem π
if i may ask some question again, sir. right now i am using useFetch, but the data won't display until i made some changes (in this case console.log) , but after the refresh, the data dissapeared. did i made a mistakes? @manniL / TheAlexLichter
that's weird. Should not happen at all π
How do you further use
data
?
Can you show the full code?here's the code, sir.
it's kinda confused me about the difference between useFetch and $fetch, is it rendered in server or client side?
if i use the $fetch, it work just fine for all the data i've been accessing. if i access the data.jumbotronImage it is still show the result, weirdly if i access the data.jumbotronImage it break up as shown in the video, sir. @manniL / TheAlexLichter
$fetch
will refetch on client-side (so 2 calls) while useFetch
will ensure that the data is fetched server-side and will be transferred over
(in very simple terms)
when using useFetch
, you might have to use data.data.attributes
(because of how the response comes back)
@less and your API is not from /server?no it is not, i'm new to nuxt 3 sir
strange. it should work pretty well. any errors in the console?