vue3 设置全局访问接口api地

在Vue3中设置全局访问接口API的方法有多种。以下是一种常见的做法：

1. 在Vue应用的根目录（一般为main.js文件）中创建一个全局的API对象。

// main.js
import { createApp } from 'vue';
import App from './App.vue';

// 全局API对象
const api = {
  // 定义接口方法
  get: function(url, params) {
    // 发送GET请求的逻辑
  },
  post: function(url, data) {
    // 发送POST请求的逻辑
  },
  // 可以定义其他需要的接口方法
};

const app = createApp(App);

// 将API对象挂载到Vue实例的全局属性$api上
app.config.globalProperties.$api = api;

app.mount('#app');

2. 在组件中使用全局API对象。

// MyComponent.vue
export default {
  mounted() {
    // 在组件中通过this.$api调用全局API对象中的接口方法
    this.$api.get('/users', { id: 1 })
      .then(response => {
        // 处理响应结果
      })
      .catch(error => {
        // 处理错误
      });
  }
}

通过以上设置，我们可以在Vue3应用的任意组件中通过this.$api访问全局的接口API对象并调用接口方法。这样可以实现统一管理和调用接口，提高代码的复用性和可维护性。当然，也可以根据具体项目的需求，在全局API对象中定义其他需要的接口方法。