fix(nuxt3)!: custom response type for `useFetch` using first generic (#3268)

This commit is contained in:
pooya parsa 2022-02-16 21:50:19 +01:00 committed by GitHub
parent 7c3327a772
commit 77aeaa3288
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 15 additions and 7 deletions

View File

@ -13,13 +13,14 @@ export type UseFetchOptions<
> = AsyncDataOptions<DataT, Transform, PickKeys> & FetchOptions & { key?: string } > = AsyncDataOptions<DataT, Transform, PickKeys> & FetchOptions & { key?: string }
export function useFetch< export function useFetch<
ResT = void,
ReqT extends string = string, ReqT extends string = string,
ResT = FetchResult<ReqT>, _ResT = ResT extends void ? FetchResult<ReqT> : ResT,
Transform extends (res: ResT) => any = (res: ResT) => ResT, Transform extends (res: _ResT) => any = (res: _ResT) => _ResT,
PickKeys extends KeyOfRes<Transform> = KeyOfRes<Transform> PickKeys extends KeyOfRes<Transform> = KeyOfRes<Transform>
> ( > (
url: ReqT, url: ReqT,
opts: UseFetchOptions<ResT, Transform, PickKeys> = {} opts: UseFetchOptions<_ResT, Transform, PickKeys> = {}
) { ) {
if (!opts.key) { if (!opts.key) {
const keys: any = { u: url } const keys: any = { u: url }
@ -35,17 +36,18 @@ export function useFetch<
opts.key = generateKey(keys) opts.key = generateKey(keys)
} }
return useAsyncData(opts.key, () => $fetch(url, opts) as Promise<ResT>, opts) return useAsyncData(opts.key, () => $fetch(url, opts) as Promise<_ResT>, opts)
} }
export function useLazyFetch< export function useLazyFetch<
ResT = void,
ReqT extends string = string, ReqT extends string = string,
ResT = FetchResult<ReqT>, _ResT = ResT extends void ? FetchResult<ReqT> : ResT,
Transform extends (res: ResT) => any = (res: ResT) => ResT, Transform extends (res: _ResT) => any = (res: _ResT) => _ResT,
PickKeys extends KeyOfRes<Transform> = KeyOfRes<Transform> PickKeys extends KeyOfRes<Transform> = KeyOfRes<Transform>
> ( > (
url: ReqT, url: ReqT,
opts: Omit<UseFetchOptions<ResT, Transform, PickKeys>, 'lazy'> = {} opts: Omit<UseFetchOptions<_ResT, Transform, PickKeys>, 'lazy'> = {}
) { ) {
return useFetch(url, { ...opts, lazy: true }) return useFetch(url, { ...opts, lazy: true })
} }

View File

@ -7,11 +7,14 @@ import { defineNuxtConfig } from '~~/../../../packages/nuxt3/src'
import { useRouter } from '#imports' import { useRouter } from '#imports'
import { isVue3 } from '#app' import { isVue3 } from '#app'
interface TestResponse { message: string }
describe('API routes', () => { describe('API routes', () => {
it('generates types for routes', () => { it('generates types for routes', () => {
expectTypeOf($fetch('/api/hello')).toMatchTypeOf<Promise<string>>() expectTypeOf($fetch('/api/hello')).toMatchTypeOf<Promise<string>>()
expectTypeOf($fetch('/api/hey')).toMatchTypeOf<Promise<{ foo:string, baz: string }>>() expectTypeOf($fetch('/api/hey')).toMatchTypeOf<Promise<{ foo:string, baz: string }>>()
expectTypeOf($fetch('/api/other')).toMatchTypeOf<Promise<unknown>>() expectTypeOf($fetch('/api/other')).toMatchTypeOf<Promise<unknown>>()
expectTypeOf($fetch<TestResponse>('/test')).toMatchTypeOf<Promise<TestResponse>>()
}) })
it('works with useFetch', () => { it('works with useFetch', () => {
@ -19,10 +22,13 @@ describe('API routes', () => {
expectTypeOf(useFetch('/api/hey').data).toMatchTypeOf<Ref<{ foo:string, baz: string }>>() expectTypeOf(useFetch('/api/hey').data).toMatchTypeOf<Ref<{ foo:string, baz: string }>>()
expectTypeOf(useFetch('/api/hey', { pick: ['baz'] }).data).toMatchTypeOf<Ref<{ baz: string }>>() expectTypeOf(useFetch('/api/hey', { pick: ['baz'] }).data).toMatchTypeOf<Ref<{ baz: string }>>()
expectTypeOf(useFetch('/api/other').data).toMatchTypeOf<Ref<unknown>>() expectTypeOf(useFetch('/api/other').data).toMatchTypeOf<Ref<unknown>>()
expectTypeOf(useFetch<TestResponse>('/test').data).toMatchTypeOf<Ref<TestResponse>>()
expectTypeOf(useLazyFetch('/api/hello').data).toMatchTypeOf<Ref<string>>() expectTypeOf(useLazyFetch('/api/hello').data).toMatchTypeOf<Ref<string>>()
expectTypeOf(useLazyFetch('/api/hey').data).toMatchTypeOf<Ref<{ foo:string, baz: string }>>() expectTypeOf(useLazyFetch('/api/hey').data).toMatchTypeOf<Ref<{ foo:string, baz: string }>>()
expectTypeOf(useLazyFetch('/api/hey', { pick: ['baz'] }).data).toMatchTypeOf<Ref<{ baz: string }>>() expectTypeOf(useLazyFetch('/api/hey', { pick: ['baz'] }).data).toMatchTypeOf<Ref<{ baz: string }>>()
expectTypeOf(useLazyFetch('/api/other').data).toMatchTypeOf<Ref<unknown>>() expectTypeOf(useLazyFetch('/api/other').data).toMatchTypeOf<Ref<unknown>>()
expectTypeOf(useLazyFetch('/api/other').data).toMatchTypeOf<Ref<unknown>>()
expectTypeOf(useLazyFetch<TestResponse>('/test').data).toMatchTypeOf<Ref<TestResponse>>()
}) })
}) })