vue3版本中挂载axios（在main.js中配置全局axios）--以助于方便管理_vue 全局挂载axios 并使用

如果不在main.js里面配置全局axios，则，每次都要在vue文件的script标签中加入：

import axios from "axios";

1
2

而且如果端口变化，则每个文件的端口都要发生改变，这是我们不希望看到的，并且处理繁琐

axios
         .post("http://localhost:8080/xxxxx",  data )
         .then(res =>.........
1
2
3

可以在终端下载vue-axios

npm install axios vue-axios --save
1

然后在main.js里面添加：

import VueAxios from "vue-axios";
const app = createApp(App)
app.use(VueAxios,axios)


axios.defaults.headers.post['Content-type']='application/x-www-form-urlencoded'//配置默认访问请求头
axios.defaults.baseURL = "http://localhost:8088"  // 配置请求根路径
//...
1
2
3
4
5
6
7
8

这样就可以在其他界面用this.axios用了：

this.axios
            .post("/xxxxxxxxx",  data )
            .then(res=>................
1
2
3