如何创建一个可以在所有组件中使用的公共api，用于所有ajax post和get请求，而无需在vue3中使用axios？

在Vue3中，可以通过创建一个公共API来处理所有的Ajax POST和GET请求，而无需使用axios。下面是一个实现的示例：

首先，在项目的根目录下创建一个名为api.js的文件。
在api.js文件中，引入Vue和axios：

import { reactive } from 'vue'
import axios from 'axios'

创建一个名为api的响应式对象，并设置默认值：

const api = reactive({
  data: null,
  loading: false,
  error: null
})

创建一个名为request的函数，用于发送Ajax请求：

const request = async (method, url, data = null) => {
  api.loading = true
  api.error = null

  try {
    const response = await axios({
      method,
      url,
      data
    })

    api.data = response.data
  } catch (error) {
    api.error = error.message
  } finally {
    api.loading = false
  }
}

最后，将api和request导出，以便在其他组件中使用：

export { api, request }

现在，你可以在任何组件中使用这个公共API来发送Ajax请求。以下是一个示例：

import { api, request } from './api.js'

export default {
  mounted() {
    // 发送GET请求
    request('get', 'https://api.example.com/data')

    // 发送POST请求
    request('post', 'https://api.example.com/data', { name: 'John' })
  },
  computed: {
    isLoading() {
      return api.loading
    },
    isError() {
      return api.error
    },
    responseData() {
      return api.data
    }
  }
}

在上面的示例中，request函数用于发送GET和POST请求，并将响应数据存储在api.data中。你可以通过api.loading来判断请求是否正在进行中，通过api.error来获取错误信息。

这样，你就可以在所有组件中使用这个公共API来处理Ajax请求，而无需在每个组件中单独使用axios。