TypeError:使用axios驱动程序时未定义this.Vue.axios

Question

使用vue-auth (GitHub上的vue-auth)和Axios驱动程序，我在浏览器控制台中得到以下错误：

TypeError: this.Vue.axios is undefined

main.js

import Vue from "vue";
import App from "./App.vue";
import axios from "axios";
import "./libs/vue-auth";

./libs/vue-auth.js

import Vue from "vue";
import vueAuth from "@websanova/vue-auth";
import bearer from "@websanova/vue-auth/drivers/auth/bearer";
import axiosHttp from "@websanova/vue-auth/drivers/http/axios.1.x";
import vueRouter from "@websanova/vue-auth/drivers/router/vue-router.2.x";

// Vue.axios = axios;

Vue.use(vueAuth, {
  auth: bearer,
  http: axiosHttp,
  router: vueRouter
  // ...
});

当删除Vue.axios = axios;的注释时，乍一看似乎是可行的。所以我想把Vue.axios = axios;移到main.js上，但是它还是不起作用。

Answer 1

Vue.axios可以手动分配，也可以用vue-axios插件分配。因为@websanova/vue-auth/drivers/http/axios.1.x期望它存在于插件初始化上：

import Vue from 'vue'
import axios from 'axios'
import VueAxios from 'vue-axios'
...

Vue.use(VueAxios, axios)
Vue.use(vueAuth, ...)

将Vue.use(VueAxios, axios)迁移到main.js将无法工作，因为它应该在导入./libs/vue-auth之前进行评估，并且不能根据JS规范在导入之前进行。Vue.use(...)要么一起迁移到main.js，要么两者都位于./lib模块中。