大家好我是图恩,最近在给网站添加评论功能的时候又忘记了在nuxt3项目中如何发送post请求了,官网默认的请求demo都是get方式,当我找到有post请求的demo的时候,在参数这个地方又犯了难,因为我按照一般情况下axios的请求参数时data尝试发现对应不上。
历尽一番挫折后终于在ts的类型定义中找到了完整的参数如下:
function useFetch(\n url: string | Request | Ref<string | Request> | () => string | Request,\n options?: UseFetchOptions<DataT>\n): Promise<AsyncData<DataT>>\n\ntype UseFetchOptions = {\n key?: string\n method?: string\n query?: SearchParams\n params?: SearchParams\n body?: RequestInit['body'] | Record<string, any>\n headers?: Record<string, string> | [key: string, value: string][] | Headers\n baseURL?: string\n server?: boolean\n lazy?: boolean\n immediate?: boolean\n default?: () => DataT\n transform?: (input: DataT) => DataT\n pick?: string[]\n watch?: WatchSource[]\n}\n\ntype AsyncData<DataT> = {\n data: Ref<DataT>\n pending: Ref<boolean>\n refresh: (opts?: { dedupe?: boolean }) => Promise<void>\n execute: () => Promise<void>\n error: Ref<Error | boolean>\n}出乎意料的是post请求的key是body,以下为一个正常的post请求供参考:
const getCommentList = async () => {\n let { data } = await useFetch("/dsiab.com/getList", { method: "post", body: { postId: state.form.postId } })\n}大家如果也在使用nuxt3开发项目的话要特别注意这个地方。