useFetch universal ( SSR + Client )
So currently we have a simple wrapper around useFetch to perform API calls, but since latest updates i can see a warning saying that the component is already mounted, and it makes sense, because useFetch is used to pass the data from the server to the frontend, so my question is, how do we make this "universal", so we dont have to deal with checking whenever the call is running server or client side ? I can quickly make it toggle between
$fetch and useFetch since the options are similar, the problem is that the response type is not the same, this makes it really hard to have something that works both sides, what would be the best approach here?4 Replies
Alexander Lichter
YouTube
Custom $fetch and Repository Pattern in Nuxt 3
π» The repository pattern is a popular way to abstract your API calls away and provide a descriptive way to retrieve or send data. But how would you implement it in Nuxt? And should you use composables or $fetch for it? This video will give answers to all the questions!
Key points:
ποΈ Implementing the repository pattern in Nuxt
π Creating our ow...
Hum, thanks a lot for the video, while it was helpful, i still dont see where i can make this in a clean way, because i would still have to useAsyncData everywhere i want to pass stuff around :/ i have no clue if the page is being ssred ( first visit ) or its a subsequent request ( post mounted on client )
Much thanks anyway, ill dig around, but cant deny this just make stuff pretty confusing for anyone concerned with deduping
Well you don't have to always resort to $fetch. Using useAsyncData is fine, as long as you don't do that in event handlers or similar
Alexander Lichter
YouTube
You are using useFetch WRONG! (I hope you don't)
πͺπ» useFetch is a mighty composable to fetch data in your Nuxt.js application. It can do so many things, from updating state to refreshing calls easily and even data caching is possible. But often I see that people misuse useFetch because it is so tempting to use all the features, even when you shouldn't. In this video I show the most common mist...