Skip to content
This repository has been archived by the owner on Apr 6, 2023. It is now read-only.

Commit

Permalink
docs(api): add useHydration composable (#8768)
Browse files Browse the repository at this point in the history
  • Loading branch information
Krutie authored Nov 10, 2022
1 parent 5715128 commit 0cac5c7
Showing 1 changed file with 32 additions and 3 deletions.
35 changes: 32 additions & 3 deletions docs/content/3.api/1.composables/use-hydration.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,37 @@

Allows full control of the hydration cycle to set and receive data from the server.

::ReadMore{link="/getting-started/data-fetching"}
::
`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

::NeedContribution
- `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="/getting-started/data-fetching"}
::

0 comments on commit 0cac5c7

Please sign in to comment.