vue-axios使用詳解
vue-axios
GET請(qǐng)求
axios.get("/user?id=1")
.then(function(response){
})
.catch(function(error){
})
POST請(qǐng)求
axios.post('/user', {
firstName: 'Fred',
lastName: 'Flintstone'
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
合并請(qǐng)求
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) {
// Both requests are now complete
}));
配置
import Qs from 'qs'
{
//請(qǐng)求的接口,在請(qǐng)求的時(shí)候,如axios.get(url,config);這里的url會(huì)覆蓋掉config中的url
url: '/user',
// 請(qǐng)求方法同上
method: 'get', // default
// 基礎(chǔ)url前綴
baseURL: 'https://some-domain.com/api/',
transformRequest: [function (data) {
// 這里可以在發(fā)送請(qǐng)求之前對(duì)請(qǐng)求數(shù)據(jù)做處理,比如form-data格式化等,這里可以使用開頭引入的Qs(這個(gè)模塊在安裝axios的時(shí)候就已經(jīng)安裝了,不需要另外安裝)
data = Qs.stringify({});
return data;
}],
transformResponse: [function (data) {
// 這里提前處理返回的數(shù)據(jù)
return data;
}],
// 請(qǐng)求頭信息
headers: {'X-Requested-With': 'XMLHttpRequest'},
//parameter參數(shù)
params: {
ID: 12345
},
//post參數(shù),使用axios.post(url,{},config);如果沒有額外的也必須要用一個(gè)空對(duì)象,否則會(huì)報(bào)錯(cuò)
data: {
firstName: 'Fred'
},
auth: {
username: 'janedoe',
password: 's00pers3cret'
},
//設(shè)置超時(shí)時(shí)間
timeout: 1000,
//返回?cái)?shù)據(jù)類型
responseType: 'json', // default
.....等等
}
以上就是本文的全部內(nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
vue中導(dǎo)出Excel表格的實(shí)現(xiàn)代碼
項(xiàng)目中我們可能會(huì)碰到導(dǎo)出Excel文件的需求,這篇文章主要介紹了vue中導(dǎo)出Excel表格的實(shí)現(xiàn)代碼,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2018-10-10
Vue?編程式路由導(dǎo)航的實(shí)現(xiàn)示例
本文主要介紹了Vue?編程式路由導(dǎo)航2022-04-04
vue-router啟用history模式下的開發(fā)及非根目錄部署方法
這篇文章主要介紹了vue-router啟用history模式下的開發(fā)及非根目錄部署方法,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-12-12
一文搞懂vue中provide和inject實(shí)現(xiàn)原理對(duì)抗平庸
這篇文章主要為大家介紹了vue中provide和inject實(shí)現(xiàn)原理的深入理解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-04-04
Vue.js+Layer表格數(shù)據(jù)綁定與實(shí)現(xiàn)更新的實(shí)例
下面小編就為大家分享一篇Vue.js+Layer表格數(shù)據(jù)綁定與實(shí)現(xiàn)更新的實(shí)例,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2018-03-03
詳解在Vue.js編寫更好的v-for循環(huán)的6種技巧
這篇文章主要介紹了詳解在Vue.js編寫更好的v-for循環(huán)的6種技巧,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-04-04
Vue2.0 給Tab標(biāo)簽頁和頁面切換過渡添加樣式的方法
下面小編就為大家分享一篇Vue2.0 給Tab標(biāo)簽頁和頁面切換過渡添加樣式的方法,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2018-03-03
el-form的label和表單自適應(yīng)填滿一行且靠左對(duì)齊方式
這篇文章主要介紹了el-form的label和表單自適應(yīng)填滿一行且靠左對(duì)齊方式,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2022-10-10

