mirror of
https://github.com/nuxt/nuxt.git
synced 2024-11-14 10:04:05 +00:00
90784f79d7
* docs: implement new website theme * chore: rename dirs * chore: update build * lint fix * chore: update deps * fix: include node_modules in esbuild step * chore: update deps * Update .gitignore * chore: update theme version * up * up * fix: use svg for illustration * chore: update to 0.0.12 * chore: force parse5 resolution * stay with build * feat: always display first home section * Update yarn.lock * chore: update theme * fix lint * docs: update home title * chore: update website theme version * Update docs/content/0.index.md Co-authored-by: pooya parsa <pyapar@gmail.com> * Update docs/content/0.index.md Co-authored-by: pooya parsa <pyapar@gmail.com> * up * chore: bump theme version * up * chore: up * up up and up * chore: generate * fix: boolean value * feat: new images * update again * chore: up * ouep * chore: up Co-authored-by: Daniel Roe <daniel@roe.dev> Co-authored-by: Clément Ollivier <clement.o2p@gmail.com> Co-authored-by: pooya parsa <pyapar@gmail.com>
39 lines
1.1 KiB
Markdown
39 lines
1.1 KiB
Markdown
# `useHydration`
|
|
|
|
Allows full control of the hydration cycle to set and receive data from the server.
|
|
|
|
`useHydration` is a built-in composable that provides a way to set data on the server side every time a new HTTP request is made and receive that data on the client side. This way `useHydration` allows you to take full control of the hydration cycle.
|
|
|
|
## Type
|
|
|
|
```ts [signature]
|
|
useHydration <T> (key: string, get: () => T, set: (value: T) => void) => {}
|
|
```
|
|
|
|
You can use `useHydration()` within composables, plugins and components.
|
|
|
|
`useHydration` accepts three parameters:
|
|
|
|
- `key`
|
|
|
|
**Type**: `String`
|
|
|
|
`key` is a unique key that identifies the data in your Nuxt application
|
|
|
|
- `get`
|
|
|
|
**Type**: `Function`
|
|
|
|
`get` is a function that returns the value to set the initial data
|
|
|
|
- `set`
|
|
|
|
**Type**: `Function`
|
|
|
|
`set` a function that receives the data on the client-side
|
|
|
|
Once the initial data is returned using the `get` function on the server side, you can access that data within `nuxtApp.payload` using the unique key that is passed as the first parameter in `useHydration` composable.
|
|
|
|
::ReadMore{link="/docs/getting-started/data-fetching"}
|
|
::
|