Zengtudor/Nuxt
1
0
Fork 0
mirror of https://github.com/nuxt/nuxt.git synced 2025-01-31 07:40:33 +00:00
Code Issues Packages Projects Releases Wiki Activity

docs: add query option with example for useFetch (#8719)

Browse Source
This commit is contained in:
Stefan 2022-11-10 10:47:50 +01:00 committed by GitHub
parent 0cac5c710c
commit 3b5571376c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 14 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
docs/content/3.api/1.composables/use-fetch.md
View File

@ -15,6 +15,7 @@ function useFetch(
type UseFetchOptions = {
key?: string
method?: string
query?: SearchParams
params?: SearchParams
body?: RequestInit['body'] | Record<string, any>
headers?: { key: string, value: string }[]
@ -43,7 +44,8 @@ type AsyncData<DataT> = {
* **Url**: The URL to fetch.
* **Options (extends [unjs/ohmyfetch](https://github.com/unjs/ohmyfetch) options & [AsyncDataOptions](/api/composables/use-async-data#params))**:
* `method`: Request method.
* `params`: Query params.
* `query`: Adds query search params to URL using [ufo](https://github.com/unjs/ufo)
* `params`: Alias for `query`
* `body`: Request body - automatically stringified (if an object is passed).
* `headers`: Request headers.
* `baseURL`: Base URL for the request.
@ -86,6 +88,17 @@ const { data, pending, error, refresh } = await useFetch('https://api.nuxtjs.dev
pick: ['title']
})
```
Adding Query Search Params:
Using the `query` option, you can add search parameters to your query. This option is extended from [unjs/ohmyfetch](https://github.com/unjs/ohmyfetch) and is using [ufo](https://github.com/unjs/ufo) to create the URL. Objects are automatically stringified.
```ts
const param1 = ref('value1')
const { data, pending, error, refresh } = await useFetch('https://api.nuxtjs.dev/mountains',{
query: { param1, param2: 'value2' }
})
```
Results in `https://api.nuxtjs.dev/mountains?param1=value1&param2=value2`
Using [interceptors](https://github.com/unjs/ohmyfetch#%EF%B8%8F-interceptors):