Data Fetching: useFetch and useAsyncData
useFetch(), useAsyncData(), server-side vs client-side fetch, refresh(), pending state.
Fetching Data in Nuxt
Nuxt provides SSR-aware data fetching composables. They run on the server during render and pass results to the client, avoiding a duplicate request and a flash of empty content.
useFetch Basics
useFetch wraps a URL fetch. It returns reactive data, pending, and error values you can use directly in the template.
<script setup>
const { data, pending, error } = await useFetch('/api/posts')
</script>All lessons in this course
- Nuxt 3 Project Structure and File-Based Routing
- Data Fetching: useFetch and useAsyncData
- Nuxt Server Routes and API Endpoints
- SSR vs SSG vs SPA Mode