axios 正確開啟檔案

標籤：imp   pread   err   ora   rmi   ret   開啟   line   port   

一、安裝
1、 利用npm安裝npm install axios --save
2、 利用bower安裝bower install axios --save
3、 直接利用cdn引入<script src="https://unpkg.com/axios/dist/axios.min.js"></script>（vue架構的直接忽略）
bind（this）很多人喜歡在外面定義一個that,裡面用that來指向外部的this是一個道理。為瞭解決無法訪問到 Vue 執行個體
.Catch錯誤處理

axios 並不能 use，只能每個需要發送請求的組件中即時引入
為瞭解決這個問題，有兩種開發思路，一是在引入 axios 之後，修改原型鏈，二是結合 Vuex，封裝一個 aciton。
import axios from ‘axios‘
這時候如果在其它的組件中，是無法使用 axios 命令的。但如果將 axios 改寫為 Vue 的原型屬性，就能解決這個問題
Vue.prototype.$ajax = axios

vue-resource不改變this指向；axios會改變 存下 var _this=this;/var that = this；

發送一個GET請求
//通過給定的ID來發送請求
axios.get(‘/user?ID=12345‘)
.then(function(response){
　　console.log(response);
})
.catch(function(err){
　　console.log(err);
});
//以上請求也可以通過這種方式來發送
axios.get(‘/user‘,{
　　params:{
　　　　ID:12345
　　}
})
.then(function(response){
　　console.log(response);
})
.catch(function(err){
　　console.log(err);
});

發送一個POST請求

axios.post(‘/user‘,{
　　firstName:‘Fred‘,
　　lastName:‘Flintstone‘
})
.then(function(res){
　　console.log(res);
})
.catch(function(err){
　　console.log(err);
});

3、一次性並發多個請求
function getUserAccount(){
　　return axios.get(‘/user/12345‘);
}
function getUserPermissions(){
　　return axios.get(‘/user/12345/permissions‘);
}
axios.all([getUserAccount(),getUserPermissions()])
.then(axios.spread(function(acct,perms){
//當這兩個請求都完成的時候會觸發這個函數，兩個參數分別代表返回的結果
}))

axios 正確開啟檔案