javascript - Vue.js全局Axios调用

我正在写一个项目，它使用了很多来自不同页面的Axios调用。代替使用AXIOS调用多次，是否可以编写单个AXIOS调用函数并在每个页面中使用它。
对于EX，定义一个“AxoSCALL”函数一次，而不是通过调用该函数在不同的页面中使用它。

axiosCall (serviceName, parameter) {
  axios
    .get(`http://localhost/xApi/` + serviceName + `/` + parameter)
    .then(response => {
        return response.data
    })
    .catch(e => {
      this.exceptionHandler('Error at get ' + serviceName + ' : ', e)
    })
}

然后像这样使用它

var userData = axiosCall('user',1)
var roleData = axiosCall('role',2)

提前谢谢

最佳答案

有几种方法可以做到这一点：
在引导文件（即main.js中）中，可以在初始化Vue之前执行Vue.prototype.$axiosCall = function () { ... }操作，然后在组件中只需调用this.$axiosCall('user', 1)。
另一种方法是使用mixin（axiosmixin.js）：

export default {
  methods: {
    axiosCall () { ... }
  }
}

然后将其作为全局mixin包含在引导文件中，如：Vue.mixin(UserMixin)（同样，在初始化完成之前，在引导文件中）。