如何设置全局 useFetch 可组合项中使用的 baseUrl(可能是 nuxt.config.ts)?
如何避免在每次 useFetch 中定义它?
您可以在 nuxt.config.js|ts 中定义 baseURL,如下所示:
nuxt.config.js|ts
baseURL
import { defineNuxtConfig } from 'nuxt' export default defineNuxtConfig({ // ... runtimeConfig: { public: { baseURL: process.env.BASE_URL || 'https://api.example.com/', }, }, // ...
(或使用固定值或仅环境变量 - 根据您的喜好)
并添加此可组合项:
// /composables/useMyFetch.js export const useMyFetch = (request, opts) => { const config = useRuntimeConfig() return useFetch(request, { baseURL: config.public.baseURL, ...opts }) }
如果你想要类型安全,你可以这样实现:
// /composables/useMyFetch.ts export const useMyFetch: typeof useFetch = (request, opts?) => { const config = useRuntimeConfig() return useFetch(request, { baseURL: config.public.baseURL, ...opts }) }
然后您可以使用 useMyFetch 作为 useFetch 的替代品 - 但要设置 baseURL :-)
useMyFetch
useFetch
您可以在
nuxt.config.js|ts
中定义baseURL
,如下所示:(或使用固定值或仅环境变量 - 根据您的喜好)
并添加此可组合项:
如果你想要类型安全,你可以这样实现:
然后您可以使用
useMyFetch
作为useFetch
的替代品 - 但要设置 baseURL :-)