axios的特点以及使用

（一）什么是axios

1. axios是基于Promise的HTTP库

2. 即可用于浏览器也可以用于node

var defaults.adapter = getDefaultAdapter();
function getDefaultAdapter () {
	var adapter;
    if (typeof XMLHttpRequest !== 'undefined') {
    	// 浏览器环境
        adapter = require('./adapter/xhr');
    } else if (typeof process !== 'undefined') {
    	// node环境
        adapter = require('./adapter/http');
    }
   return adapter;
}

  (二) axios的优点

1. 支持Promise API

2. 拦截请求和响应

3. 转换请求数据和响应数据

4. 取消请求

5.自动转换json数据

6. 客户端支持防御XSRF攻击

（三）五种axios的请求方法：

get、post、put、patch、delete

put/patch: 编辑、更新数据，区别如下～

put: 是要讲所有数据全部推送到后端 （一般用于更新）

patch: 只将修改的数据推送到后端

delete: 删除数据

3.1 post提交

    3.1.1 form-data （图片上传、表单提交）

    3.1.2 application/json (一般用这种)

（四）并发请求

并发请求：同时发送多个请求，并统一处理返回值 （比如渲染一个页面，刚开始同时调用多个接口）

（1）axios.all()， axios.spread()

all()里面是一个数组，数组里面放请求，如果接口都请求成功，才会触发.then

mounted () {
    axios.all([
      axios.get(url + '/city'),
      axios.get(url + '/card')
    ]).then(
      axios.spread((cityRes, cardRes) => {
        console.log(cityRes)
        console.log(cityRes)
      })
    )
  }

.all里面有多少个参数，.spread的箭头函数里面也应该有多少个参数，一一对应～

（五）axios的配置

5.1 全局配置 在main.js里面 (axios.defaults)

axios.defaults.timeout = 1000 // 设置全局超时时间
axios.defaults.baseUrl = 'localhost:8080' // 设置全局baseUrl

5.2 axios请求配置

 axios.get(url + '/city', {
      params: {}, // 参数
      timeout: 3000 // 配置
    }).then((res) => {
      console.log(res)
    })