一、現象
統一處理錯誤及配置請求信息
二、解決
1、安裝 axios , 命令: npm install axios --save-dev
2、在根目錄的config目錄下新建文件 axios.js ,內容如下:
import axios from 'axios'
// 配置默認的host,假如你的API host是:http://api.htmlx.club
axios.defaults.baseURL = 'http://api.htmlx.club'
// 添加請求攔截器
axios.interceptors.request.use(function (config) {
// 在發送請求之前做些什么
return config
}, function (error) {
// 對請求錯誤做些什么
return Promise.reject(error)
});
// 添加響應攔截器
axios.interceptors.response.use(function (response) {
// 對響應數據做點什么
return response
}, function (error) {
// 對響應錯誤做點什么
return Promise.reject(error)
});
3、在main.js中進行引用,並配置一個別名($ajax)來進行調用:
import axios from 'axios'
import '../config/axios'
Vue.prototype.$ajax = axios
如圖:
4、應用,一個登錄的post如:
this.$ajax({
method: 'post',
url: '/login',
data: {
'userName': 'xxx',
'password': 'xxx'
}
}).then(res => {
console.log(res)
})
三、總結
統一處理方便
昵稱:
退出 訂閱評論
[Ctrl+Enter快捷鍵提交]
【活動】杭州雲棲·2050大會-全世界年青人因科技而團聚-源點
【搶購】新注冊用戶域名搶購1元起
· 浙大90后學霸的首篇一作登上Science!這個團隊的研究還很接“地氣”!
· 谷歌搜索開始猜你問什么 為語音搜索打下基礎
· HoloLens之父Alex Kipman:2018年MR有這三大趨勢
· 微軟Teams終於上線訪客功能
· Slack競品:Google宣布Hangouts Chat正式上線
» 更多新聞...
· 和程序員談戀愛
· 學會學習
· 優秀技術人的管理陷阱
· 作為一個程序員,數學對你到底有多重要