Question

我在提示项目中使用axios，并尝试设置一些自定义默认设置以使用它。

所以我做了axios.js文件

import axios from 'axios'

const API_URL = 'http://localhost:8081'

export default axios.create({
  baseUrl: API_URL,
  headers: {
    'Content-Type': 'application/json',
    'Authorization': 'Bearer ' + localStorage.token
  }
})

然后我使用我的axios将它安装在/components/axios/index.js中

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

import axios from './axios'

Vue.use(VueAxios, axios)

这样，我应该使用正确的设置来设置全局axios吗？

因此，在我的Login.vue组件文件中，我将此方法称为

login() {
      this.$http
        .post("/oauth/token", {
          username: this.email,
          password: this.password,
          client_id: "test",
          client_secret: "test",
          grant_type: "password"
        },
        )
        .then(request => this.loginSuccessful(request))
        .catch(() => this.loginFailed());
    }

但是$http没有我的自定义设置，但是axios通用

Answer 1

好吧，我遇到了同样的问题，发现baseURL区分大小写。

因此，baseUrl应该为baseURL，一切正常。

这里是创建实例的axios documentation。

const instance = axios.create({
  baseURL: 'https://some-domain.com/api/',
  timeout: 1000,
  headers: {'X-Custom-Header': 'foobar'}
});

这里在工作Codesandbox

希望这会有所帮助！

Answer 2

祝你好运。但是您确定正确使用axios吗？我看到了。$ http.post用于没有axios的普通请求，在npm上，VueAxios不使用它。

我可以向您推荐此链接 https://fr.vuejs.org/v2/cookbook/using-axios-to-consume-apis.html

vue js无法使用自定义axios设置

2 个答案: