nuxt3如何发送post请求？

大家好我是图恩，最近在给网站添加评论功能的时候又忘记了在nuxt3项目中如何发送post请求了，官网默认的请求demo都是get方式，当我找到有post请求的demo的时候，在参数这个地方又犯了难，因为我按照一般情况下axios的请求参数时data尝试发现对应不上。

历尽一番挫折后终于在ts的类型定义中找到了完整的参数如下：

function useFetch(
  url: string | Request | Ref<string | Request> | () => string | Request,
  options?: UseFetchOptions<DataT>
): Promise<AsyncData<DataT>>

type UseFetchOptions = {
  key?: string
  method?: string
  query?: SearchParams
  params?: SearchParams
  body?: RequestInit['body'] | Record<string, any>
  headers?: Record<string, string> | [key: string, value: string][] | Headers
  baseURL?: string
  server?: boolean
  lazy?: boolean
  immediate?: boolean
  default?: () => DataT
  transform?: (input: DataT) => DataT
  pick?: string[]
  watch?: WatchSource[]
}

type AsyncData<DataT> = {
  data: Ref<DataT>
  pending: Ref<boolean>
  refresh: (opts?: { dedupe?: boolean }) => Promise<void>
  execute: () => Promise<void>
  error: Ref<Error | boolean>
}

出乎意料的是post请求的key是body,以下为一个正常的post请求供参考：

const getCommentList = async () => {
  let { data } = await useFetch("/dsiab.com/getList", { method: "post", body: { postId: state.form.postId } })
}

大家如果也在使用nuxt3开发项目的话要特别注意这个地方。

本文章由javascript技术分享原创和收集