Zengtudor/Nuxt
1
0
Fork 0
mirror of https://github.com/nuxt/nuxt.git synced 2024-11-29 09:02:03 +00:00
Code Issues Packages Projects Releases Wiki Activity

docs: clarify server: false doesn't await on initial load (#22619)

Browse Source
This commit is contained in:
Michael 2023-08-14 00:35:04 +03:00 committed by GitHub
parent 4e409614e8
commit 4fbc270be1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 5 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
docs/1.getting-started/6.data-fetching.md
View File

@ -149,7 +149,9 @@ const { pending, data: posts } = useLazyFetch('/api/posts')
### Client-only fetching
By default, data fetching composables will perform their asynchronous function on both client and server environments. Set the `server` option to `false` to only perform the call on the client-side. Combined with the `lazy` option, this can be useful for data that are not needed on the first render (for example, non-SEO sensitive data).
By default, data fetching composables will perform their asynchronous function on both client and server environments. Set the `server` option to `false` to only perform the call on the client-side. On initial load, the data will not be fetched before hydration is complete so you have to handle a pending state, though on subsequent client-side navigation the data will be awaited before loading the page.
Combined with the `lazy` option, this can be useful for data that is not needed on the first render (for example, non-SEO sensitive data).
```ts
/* This call will only be performed on the client */
@ -159,6 +161,8 @@ const { pending, data: posts } = useFetch('/api/comments', {
})
```
The `useFetch` composable is meant to be invoked in setup method or called directly at the top level of a function in lifecycle hooks, otherwise you should use `$fetch` method.
### Minimize payload size
The `pick` option helps you to minimize the payload size stored in your HTML document by only selecting the fields that you want returned from the composables.