使用 cnpm 安裝 axios
cnpm install axios --save-dev
首先在 main.js 中引入 axios
import axios from 'axios'
這時候如果在其它的組件中先紫,是無法使用 axios 命令的。所以我們將 axios 改寫為 Vue 的原型屬性
Vue.prototype.$http = axios
在 main.js 中添加了這兩行代碼之后玫鸟,就能直接在組件的 methods 中使用 $http命令
例如
methods: {
? ? ? show() ?{?
? ? ? ? ? ? this.$http ({
? ? ? ? ? ? ? ? method:'get',?
? ? ? ? ? ? ? ? url:'/user',?
? ? ? ? ? ? ? ? ?data: {
? ? ? ? ? ? ? ? ? ? ? name:'virus'
? ? ? ? ? ? ? ? ? }
? ? ? ? ? ? ?})
?}
配置 axios
?1.對于get請求
? ? ?axios.get('/user', {??
? ? ? ? params:{? ? ?
?? ? ? ? ? name:"virus"
? ? ? ? ? }? ??
})
2.對于post請求
axios.post('/user',{?
?? ? name:"virus"
})
3舰罚、 一次性并發(fā)多個請求
function getUserAccount (){
? return axios.get ('/user/12345');
}
functiongetUserPermissions(){
? return axios.get('/user/12345/permissions');
}
axios.all([getUserAccount(),getUserPermissions()])??
? .then(axios.spread(function(acct,perms){
//當這兩個請求都完成的時候會觸發(fā)這個函數(shù)胎围,兩個參數(shù)分別代表返回的結(jié)果
}))
4.axios可以通過配置(config)來發(fā)送請求
//發(fā)送一個`POST`請求
axios({? ??
? ? ?method:"POST",??
? ? ?url:'/user/1111',? ?
? ? ?data:{? ? ??
? ? ? ? ?name:"virus"
? ? ?}
});