vue cli+axios封装（个人总结性笔记）

一、封装调用axios的方法 

 

1.axios不支持vue.use()方式声明使用，新建一个文件夹Api，在里面添加一个index.js。

2. index.js 添加vue全局插件api

export default {
  install (Vue) {
    Vue.prototype.$api = {
      getInfo () {
        return axios.get(`/animals`) // 具体接口
      }
    }
  }
}

3. 在main.js中

import Api from './api'

Vue.use(Api)

4. 调用

this.$api.getInfo().then(res => {

})

二、index.js写法

1. 导入axios以及qs

import axios from 'axios'
import qs from 'qs'
import { Message } from 'element-ui' // 弹出错误示警

2. 声明基础路径

let baseUrl = '//local.balabala.cn/balabala'