Nuxt•2y ago

Writing a wrapper for useFetch

Hey!

We'd like to write some helper wrappers for useFetch (for example to call Ghost CMS endpoints for posts, or pages, all with their own composable abstracted.

I'm wondering how do you correctly type the fetch options? I just want to pass the type through

export default function useGhostData(url: string, options: UseFetchOptions) { // UseFetchOptions requires 6 params
  const runtimeConfig = useRuntimeConfig()

  return useFetch(`${runtimeConfig}${url}`, options)
}

export default function useGhostData(url: string, options: UseFetchOptions) { // UseFetchOptions requires 6 params
  const runtimeConfig = useRuntimeConfig()

  return useFetch(`${runtimeConfig}${url}`, options)
}

export default function useGhostData(url: string, options: UseFetchOptions) { // UseFetchOptions requires 6 params
  const runtimeConfig = useRuntimeConfig()

  return useFetch(`${runtimeConfig}${url}`, options)
}

export default function useGhostData(url: string, options: UseFetchOptions) { // UseFetchOptions requires 6 params
  const runtimeConfig = useRuntimeConfig()

  return useFetch(`${runtimeConfig}${url}`, options)
}

Reinier KaperOP•3/22/24, 6:09 PM

Oh, it's just passing in a generic, isn't it?

Reinier KaperOP•3/22/24, 6:09 PM

export default function useGhostData<T>(url: string, options: UseFetchOptions<T>) {export default function useGhostData<T>(url: string, options: UseFetchOptions<T>) { should do it