From 98ad5c23549f182d8cfd95648f9792258f501456 Mon Sep 17 00:00:00 2001 From: HomWang <516310460@qq.com> Date: Sat, 3 Sep 2022 14:17:55 +0800 Subject: [PATCH 1/7] Added request and response Added request settings and response data, error handling --- docs/content/3.api/1.composables/use-fetch.md | 15 +++++++++++++++ 1 file changed, 15 insertions(+) diff --git a/docs/content/3.api/1.composables/use-fetch.md b/docs/content/3.api/1.composables/use-fetch.md index dd61bc6bca2..ee0b8a7f516 100644 --- a/docs/content/3.api/1.composables/use-fetch.md +++ b/docs/content/3.api/1.composables/use-fetch.md @@ -72,6 +72,21 @@ By default, Nuxt waits until a `refresh` is finished before it can be executed a const { data, pending, error, refresh } = await useFetch( 'https://api.nuxtjs.dev/mountains', { + onRequest({ options }) { + // Set your request headers + options.headers = options.headers || {}; + options.headers['authorize'] = 'authorize'; + }, + onRequestError({ error }){ + // Handling your request errors + }, + onResponse({ response }) { + // Process your response data + return response._data + }, + onResponseError({ response }){ + // Handling your response errors + }, pick: ['title'] } ) From 4ef7f8d085366dd46ac1a3d2290f080e0398a639 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Damian=20G=C5=82owala?= <48835293+DamianGlowala@users.noreply.github.com> Date: Sat, 3 Sep 2022 15:15:52 +0200 Subject: [PATCH 2/7] Update use-fetch.md --- docs/content/3.api/1.composables/use-fetch.md | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/docs/content/3.api/1.composables/use-fetch.md b/docs/content/3.api/1.composables/use-fetch.md index ee0b8a7f516..f51405691e2 100644 --- a/docs/content/3.api/1.composables/use-fetch.md +++ b/docs/content/3.api/1.composables/use-fetch.md @@ -4,7 +4,7 @@ This composable provides a convenient wrapper around [`useAsyncData`](/api/compo ## Type -```ts [Signature] +```ts function useFetch( url: string | Request | Ref | () => string | Request, options?: UseFetchOptions @@ -73,19 +73,19 @@ const { data, pending, error, refresh } = await useFetch( 'https://api.nuxtjs.dev/mountains', { onRequest({ options }) { - // Set your request headers - options.headers = options.headers || {}; - options.headers['authorize'] = 'authorize'; + // set the request headers + options.headers = options.headers || {} + options.headers.authorize = 'authorize' }, - onRequestError({ error }){ - // Handling your request errors + onRequestError({ error }) { + // handle the request errors }, onResponse({ response }) { - // Process your response data + // process the response data return response._data }, - onResponseError({ response }){ - // Handling your response errors + onResponseError({ response }) { + // handle the response errors }, pick: ['title'] } From 58f4a2889a7717a89da688c5d2a32ce8a0319521 Mon Sep 17 00:00:00 2001 From: Pooya Parsa Date: Mon, 5 Sep 2022 09:36:51 +0200 Subject: [PATCH 3/7] extract interceptors section --- docs/content/3.api/1.composables/use-fetch.md | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/docs/content/3.api/1.composables/use-fetch.md b/docs/content/3.api/1.composables/use-fetch.md index f51405691e2..e05f7b3d281 100644 --- a/docs/content/3.api/1.composables/use-fetch.md +++ b/docs/content/3.api/1.composables/use-fetch.md @@ -68,6 +68,17 @@ By default, Nuxt waits until a `refresh` is finished before it can be executed a ## Example +```ts +const { data, pending, error, refresh } = await useFetch( + 'https://api.nuxtjs.dev/mountains', + { + pick: ['title'] + } +) +``` + +Using [interceptors](https://github.com/unjs/ohmyfetch#%EF%B8%8F-interceptors): + ```ts const { data, pending, error, refresh } = await useFetch( 'https://api.nuxtjs.dev/mountains', From a06723751d3cdb210f73ad3d4518ae9e82401120 Mon Sep 17 00:00:00 2001 From: Pooya Parsa Date: Mon, 5 Sep 2022 09:39:59 +0200 Subject: [PATCH 4/7] update --- docs/content/3.api/1.composables/use-fetch.md | 23 +++++++++---------- 1 file changed, 11 insertions(+), 12 deletions(-) diff --git a/docs/content/3.api/1.composables/use-fetch.md b/docs/content/3.api/1.composables/use-fetch.md index e05f7b3d281..ac1b398233d 100644 --- a/docs/content/3.api/1.composables/use-fetch.md +++ b/docs/content/3.api/1.composables/use-fetch.md @@ -81,24 +81,23 @@ Using [interceptors](https://github.com/unjs/ohmyfetch#%EF%B8%8F-interceptors): ```ts const { data, pending, error, refresh } = await useFetch( - 'https://api.nuxtjs.dev/mountains', + '/api/auth/login', { - onRequest({ options }) { - // set the request headers + onRequest({ request, options }) { + // Set the request headers options.headers = options.headers || {} - options.headers.authorize = 'authorize' + options.headers.authorization = '...' }, - onRequestError({ error }) { - // handle the request errors + onRequestError({ request, options, error }) { + // Handle the request errors }, - onResponse({ response }) { - // process the response data + onResponse({ request, response, options }) { + // Process the response data return response._data }, - onResponseError({ response }) { - // handle the response errors - }, - pick: ['title'] + onResponseError({ request, response, options }) { + // Pandle the response errors + } } ) ``` From feda15d8776cb4d8c8e0c1d9957e7dc86fc5e563 Mon Sep 17 00:00:00 2001 From: Pooya Parsa Date: Mon, 5 Sep 2022 09:40:42 +0200 Subject: [PATCH 5/7] simplify formatting --- docs/content/3.api/1.composables/use-fetch.md | 42 ++++++++----------- 1 file changed, 18 insertions(+), 24 deletions(-) diff --git a/docs/content/3.api/1.composables/use-fetch.md b/docs/content/3.api/1.composables/use-fetch.md index ac1b398233d..96d143ca695 100644 --- a/docs/content/3.api/1.composables/use-fetch.md +++ b/docs/content/3.api/1.composables/use-fetch.md @@ -69,37 +69,31 @@ By default, Nuxt waits until a `refresh` is finished before it can be executed a ## Example ```ts -const { data, pending, error, refresh } = await useFetch( - 'https://api.nuxtjs.dev/mountains', - { +const { data, pending, error, refresh } = await useFetch('https://api.nuxtjs.dev/mountains',{ pick: ['title'] - } -) +}) ``` Using [interceptors](https://github.com/unjs/ohmyfetch#%EF%B8%8F-interceptors): ```ts -const { data, pending, error, refresh } = await useFetch( - '/api/auth/login', - { - onRequest({ request, options }) { - // Set the request headers - options.headers = options.headers || {} - options.headers.authorization = '...' - }, - onRequestError({ request, options, error }) { - // Handle the request errors - }, - onResponse({ request, response, options }) { - // Process the response data - return response._data - }, - onResponseError({ request, response, options }) { - // Pandle the response errors - } +const { data, pending, error, refresh } = await useFetch('/api/auth/login', { + onRequest({ request, options }) { + // Set the request headers + options.headers = options.headers || {} + options.headers.authorization = '...' + }, + onRequestError({ request, options, error }) { + // Handle the request errors + }, + onResponse({ request, response, options }) { + // Process the response data + return response._data + }, + onResponseError({ request, response, options }) { + // Pandle the response errors } -) +}) ``` :ReadMore{link="/guide/features/data-fetching"} From 4c295fb858e0c33afa4089641f96ef060d1bfa42 Mon Sep 17 00:00:00 2001 From: Pooya Parsa Date: Mon, 5 Sep 2022 09:41:01 +0200 Subject: [PATCH 6/7] add back comment --- docs/content/3.api/1.composables/use-fetch.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/content/3.api/1.composables/use-fetch.md b/docs/content/3.api/1.composables/use-fetch.md index 96d143ca695..2da8c6b36fd 100644 --- a/docs/content/3.api/1.composables/use-fetch.md +++ b/docs/content/3.api/1.composables/use-fetch.md @@ -4,7 +4,7 @@ This composable provides a convenient wrapper around [`useAsyncData`](/api/compo ## Type -```ts +```ts [Signature] function useFetch( url: string | Request | Ref | () => string | Request, options?: UseFetchOptions From 183f439c9e7851076c31b63e56282528e1c00abb Mon Sep 17 00:00:00 2001 From: pooya parsa Date: Mon, 5 Sep 2022 09:41:45 +0200 Subject: [PATCH 7/7] Update docs/content/3.api/1.composables/use-fetch.md --- docs/content/3.api/1.composables/use-fetch.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/content/3.api/1.composables/use-fetch.md b/docs/content/3.api/1.composables/use-fetch.md index 2da8c6b36fd..e7febbc889b 100644 --- a/docs/content/3.api/1.composables/use-fetch.md +++ b/docs/content/3.api/1.composables/use-fetch.md @@ -4,7 +4,7 @@ This composable provides a convenient wrapper around [`useAsyncData`](/api/compo ## Type -```ts [Signature] +```ts [Signature] function useFetch( url: string | Request | Ref | () => string | Request, options?: UseFetchOptions