axios是vue官方引薦的http庫，概況見官方中文文檔。

裝置：

npm install axios

裝置依靠：

npm install --save axios vue-axios

設置模板：

//main.js中
import Vue from 'vue'
import axios from 'axios'
import VueAxios from 'vue-axios'
 
Vue.use(VueAxios, axios)
//然後你就能夠愉快地運用axios啦

假如不想如許裝置，也能夠疾速援用它：

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

怎樣運用：

有好幾種要領，get post delete put patch 什麼的，不過我一般就用get和post兩種，所以我就紀錄這類中的運用要領了。

let data = {   //要傳的參數
    'loginName':'123456',
    'passWord':'123456',
    'updateSign':'52af3ce8a82f62707789fe00899ed3f0',
    'isLogin':'1'
}


//post要求

this.axios.post('/api/user/sickUserLogin/3',data)
    .then((response) {
        console.log(response);
    })
    .catch(function (error) {
        console.log(error);
    });
 
    
//get要求

this.axios.get('/api/user/sickUserLogin/3',{params:data})
    .then((response) => {
        console.log(response.data);
        console.log(response);   
    })
    .catch(function (error) {
        console.log(error);
    });

這裏要注重一點的是：get和post要求的傳參體式格局是不一樣的，緣由能夠參考這裏

axios.get('url', {params: data});
axios.post('url', data);

//get要求的參數是拼接url字符串通報的；
//post要求的參數是經由過程data要求主體通報的；

參數花樣：

axios的默許參數花樣是json字符串，傳參體式格局就像上面誰人demo一樣即可。然則假如你想以key：value的體式格局傳參，則須要做一點轉變：參考這裏
注重：假如你的要求要領是post，又劃定了參數花樣是application/x-www-form-urlencoded，則必須要運用下面這些要領中的一種。（我在寫demo的時刻測試了一下，post要領下json傳參花樣是失利的，必須要改成鍵值對的花樣，不然會報錯）
重要引薦這類寫法：

var qs = require('qs');
axios.post('/foo', qs.stringify({ 'bar': 123 }));

這個要領須要先裝置一下qs：

npm install qs

import qs from 'qs'

Vue.prototype.qs = qs;  //全局定義，運用的時刻用this.qs.stringify(data)即可

另有另一種寫法淺顯易懂：

var params = new URLSearchParams();    //這類寫法不須要引入qs
params.append('collectId',"16");       //你要傳給背景的參數值 key/value
params.append('collectTye',"2");
params.append('isCancel',"2",);


this.$axios({
    method: 'post',
    url:url,
    data: params 
}).then((res)=>{

})

設置axios的baseURL：

//在main.js中：
axios.defaults.baseURL = 'http://api.eeesys.com:18087/';
//這些詳細的寫法能夠多看幾遍文檔，就懂了，我也不是很懂
//依據我的考試，如許寫了以後，要求會疏忽掉proxyTable中的設置，直接要求這個地點，如許在臨盆環境下就能夠夠跨域了，不知道是否是如許的

從新定義一個axios實例：

const $axios = axios.create({
    baseURL: 'http://api.eeesys.com:18087/',
    timeout: 5000,
    headers: {
        'Content-Type': 'application/x-www-form-urlencoded'
    }
});

// 初始化默許post header,這裏劃定了post要求的傳參花樣是application/x-www-form-urlencoded
//假如不如許寫，背景接收到的參數是null
$axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';
Vue.prototype.$axios = $axios;

如許就能夠夠在代碼中運用本身定義的axios實例，沒有設置的屬性會繼續lib/defaults.js文件中的設置