What is `useAsyncData` in Nuxt.js?

Answer

useAsyncData is a Nuxt composable used to fetch data asynchronously in a way that is compatible with both SSR and CSR. It takes a unique key and an async function, executes the function on the server during SSR, serializes the result into the page payload, and reuses that data on the client during hydration — preventing a duplicate network request. The return value includes data, pending, error, and refresh refs. Example: const { data } = await useAsyncData('posts', () => $fetch('/api/posts')). The unique key ensures data is deduplicated across server and client.