在 vuejs 组件中获取 axios base url 的值答案

【问题标题】：Fetch the value of axios base url in a vuejs component在 vuejs 组件中获取 axios base url 的值
【发布时间】：2018-05-04 01:32:44
【问题描述】：

我已经像这样在 vuejs 全局配置中设置了我的 axios 配置

const axiosConfig = {
baseURL: 'http://127.0.0.1:8000/api',
timeout: 30000, 
 };
Vue.prototype.$axios =  axios.create(axiosConfig);

现在我想在组件中检索 basEuRL 的值

<script>
  data:()=>({
     apiurl:this.$axios.baseURL
   })
<script>

但以上不起作用。我希望属性 apiurl 有

http://127.0.0.1:8000/api

【问题讨论】：

axios.defaults.baseURL = 'http://127.0.0.1:8000/api' 在 main.js 中，带有单个文件组件设置。然后在别处使用/something 得到http://127.0.0.1:8000/api/something。 github.com/axios/axios#config-defaults

标签： javascript vuejs2 axios

【解决方案1】：

不知道为什么需要在数据组件中调用baseURL，但我找到了一种使用axios baseURL 的常用方法，例如Vue.js REST API Consumption with Axios：

// http-common.js
import axios from 'axios';

export const HTTP = axios.create({
  baseURL: `http://jsonplaceholder.typicode.com/`,
  headers: {
    Authorization: 'Bearer {token}'
  }
})

然后

import {HTTP} from './http-common';
HTTP.get(`posts`)
    .then(response => {
      this.posts = response.data
    })
    .catch(e => {
      this.errors.push(e)
    })

【讨论】：