2020-11-18

/* 方法1: */
在main入口
// 1.导入axios包（首先安装完成该axio）
import axios from 'axios'
// 2.为了方便也要给axios设置一个根路径

axios.defaults.baseURL='根路径'

按需配置请求拦截器

axios.interceptors.request.use({})

按需配置响应拦截器

axios.interceptors.response.use({})

// 3.把axios挂载到vue的prototype的原型对象上

Vue.prototype.$http=axios  //$http是一个自定义属性名

/
// 4.在其他文件中使用

this.$http.get/post("请求地址",请求参数)

/* 方法2： */
1.创建一个axios文件，列如request.js文件
2.导入axios包（首先安装完成该axio）

import axios from 'axios'

3.创建一个axios实例

 const request= axios.create({
  baseURL:'基本路经'
})

4.请求拦截器
5.响应拦截器
6.向外暴漏此实例

export default request

7.当需要发请求的时候，我们封装一个请求的文件use.js
a.在这个请求文件到入request文件
b.

export const 请求的方法名=参数=>{
  return  request({
    method:'psot/get',
    url:'地址'
    参数
  })
}

8.需要使用的此请求的文件组件
a.按需导入 import {请求的方法名} from use.js
b.使用：

try{
  //成功请求
  const res= 请求的方法名(相应的参数)   （ 此时切记不要加this）
}
catch(err){
  //失败请求
}

方式一：简单方便，但不利于接口的维护，我们可以把请求对象挂载到Vue.prototype原型对象，然后通过this.xxx直接请求
方式二：我们把每一个请求都封装成每个堵路的功能函数，在需要的时候加载调用，这种方法更便于管理维护