docs: use sfc syntax in example (#22073)

Co-authored-by: Sébastien Chopin <seb@nuxtlabs.com>
This commit is contained in:
Eduardo San Martin Morote 2023-07-10 16:48:57 +02:00 committed by GitHub
parent bf7e96c7c6
commit c76d58051f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -90,11 +90,9 @@ await nuxtApp.callHook('my-plugin:init')
- **data** (object) - When you fetch the data from an API endpoint using either [`useFetch`](/docs/api/composables/use-fetch) or [`useAsyncData`](/docs/api/composables/use-async-data) , resulting payload can be accessed from the `payload.data`. This data is cached and helps you prevent fetching the same data in case an identical request is made more than once. - **data** (object) - When you fetch the data from an API endpoint using either [`useFetch`](/docs/api/composables/use-fetch) or [`useAsyncData`](/docs/api/composables/use-async-data) , resulting payload can be accessed from the `payload.data`. This data is cached and helps you prevent fetching the same data in case an identical request is made more than once.
```vue [app.vue] ```vue [app.vue]
export default defineComponent({ <script setup>
async setup() { const { data } = await useAsyncData('count', () => $fetch('/api/count'))
const { data } = await useAsyncData('count', () => $fetch('/api/count')) </script>
}
})
``` ```
After fetching the value of `count` using [`useAsyncData`](/docs/api/composables/use-async-data) in the example above, if you access `payload.data`, you will see `{ count: 1 }` recorded there. The value of `count` is updated whenever the page count increases. After fetching the value of `count` using [`useAsyncData`](/docs/api/composables/use-async-data) in the example above, if you access `payload.data`, you will see `{ count: 1 }` recorded there. The value of `count` is updated whenever the page count increases.