vue-Axios

基于Promise 用于浏览器和 node.js的与服务器通讯的库
支持Promise API
安装

使用 npm:

$ npm install axios
npm install vue-axios --save
Vue.use(VueAxios,Axios)

import axios from './axios'
使用 bower:

$ bower install axios

使用 cdn:

<script src="https://unpkg.com/axios/dist/axios.min.js"></script>

GET:

<script type="text/javascript">
    import axios from 'axios'
    export default {

        created(){
            axios({
                method: 'get',
                url: 'https://easy-mock.com/mock/5b5d95b8031c6933a3664fcf/example/query'
            })
            .then((data)=>{
                console.log(data);
            })
            .catch((err)=>{
                console.log(err);
            })
        }
    }
</script>

请求方式：

支持的请求方式：
axios:get(url,{
          params:{ //向后端发送数据
                  abc: '123' 
              }
        }).then((data)=>{}).catch((err)=>{})   axios.get(url,data)
axios:post(url,{
               abc: '123' //向后端发送数据
        }).then((data)=>{}).catch((err)=>{})   axios.get(url,data)
axios:delete(url,)
axios:head(url,)
axios:options(url,)
axios:put(url,data,)
axios:patch(url,data,)

简化请求地址：

<script type="text/javascript">
    import axios from 'axios'
      var http =axios.create({
              baseURL:' https://easy-mock.com/mock/5b5d95b8031c6933a3664fcf/example/'
/*基本路径*/
              timeout: 1000//多少毫秒中断发生（请求超时）
              responseType: 'json'   可以设置返回数据为json格式
              headers:{   //可以自定义请求头
                      'custome-header' : 'hello'  
                }
              params: {  //设置查询字符串
                  book:  '123'
                }
              
    })
既：把公共的路径部分提取出来，请求的时候只写 不同的路径部分
    export default {
            created(){
                        http.get('/query')

     }   
}

并发请求：

    function http1(){
                http.get('url1')
            }
            function http2(){
                http.get('url2')
            }
            axios.all(http1(),http2()).then(axios.spread((res1,res2)=>{
                        res1:第一个函数的返回结果
                        res2:第二个函数的返回结果
            })) 并发