一、现象
统一处理错误及配置请求信息
二、解决
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正式上线
» 更多新闻...
· 和程序员谈恋爱
· 学会学习
· 优秀技术人的管理陷阱
· 作为一个程序员,数学对你到底有多重要