如何在vue-manage-system后台管理模板中的mian.js添加全局axios?

Question

mian.js文件内容

import {createApp} from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
import installElementPlus from './plugins/element'
import './assets/css/icon.css'
const app = createApp(App)
installElementPlus(app)
app
    .use(store)
    .use(router)
    .mount('#app')

Answer 1

vue2

import axios from 'axios'
Vue.prototype.$axios = axios

使用this.$axios.xxx

vue3global-api

Vue.prototype Replaced by config.globalProperties

import axios from 'axios';

const app = Vue.createApp(App);
app.config.globalProperties.$axios = axios;

使用this.$axios.xxx

vue3provide/inject

Provide

import axios from 'axios';

const app = Vue.createApp(App);
app.provide('$axios', axios); 

Inject

Composition API:

const { inject } = Vue;
...
setup() {
  const $axios = inject('$axios');   
  // $axios.get(...)
}

Options API:

inject: ['$axios'],