首页
工具箱
Search
1
Vue vben admin 2.0的封装部分坑点
1,546 阅读
2
python生成剪映草稿解析
1,403 阅读
3
百度地图坐标系对腾讯地图坐标系转换
1,250 阅读
4
VUE中使用mathjs的方法
1,160 阅读
5
解决Ant Design Vue的Select搜索指定字段的问题
1,081 阅读
技术宅的演示性文稿
技术宅的吐槽文档
一个的舞台
唱唱反调
老文章归档
光年计划
登录
Search
标签搜索
老文章
CS
长春
大学
程序员
vue
酷游CS俱乐部
dedecms
织梦
php
vant
小程序
军训
缘
ie6
google
大连
2012
js
ecshop
茶树虾
累计撰写
306
篇文章
累计收到
125
条评论
首页
栏目
技术宅的演示性文稿
技术宅的吐槽文档
一个的舞台
唱唱反调
老文章归档
光年计划
页面
工具箱
搜索到
1
篇与
loading
的结果
2018-11-08
Vux+Axios拦截器增加loading的问题
很多时候,我们在页面使用Ajax刷新时候,会希望它出现loading的图标,让用户体验更好一些。那么如果我们每次在Axios里面进行请求,都要显示loading图标的话,那么没有一个全局的方法的话,势必会造成代码冗余的问题。有什么方法可以实现这个方法呢?这里,我们就要用到Axios的请求拦截器与相应拦截器了首先,我们在请求拦截器里面增加一个VUX的loading组件axios.interceptors.request.use( config => { //请求拦截器,调用loading插件 // 显示loading // 判断是否重复提交请求,也就是loading是否还存在,如果存在则不显示新的loading let isShow = window.app.$vux.loading.isVisible() if(!isShow&&config.showLoading){ window.app.$vux.loading.show({ text: 'Loading' }) } config.data = JSON.stringify(config.data); config.headers = { 'Content-Type': 'application/json', } return config; }, error => { return Promise.reject(err); } ); 整个数据里面,我们看到了里面有一个参数是$vux.loading.isVisible()这个。这个是vux自带的一个loading状态显示的参数。如果loading正在显示的话,它会是true,否则的话就显示false因为我们不希望同时有多个请求的时候,出现多个loading状态,这样的话用户看起来会很迷茫,所以我们在调用的时候,先判断一下这个状态。然后在响应拦截器里面关掉它就好了
2018年11月08日
199 阅读
1 评论
1 点赞