临时存储elementUI的message提示组件实例,在下次打开网络错误的提示前及时进行对当前已存在的提示组件(netWorkFailDialog)
进行关闭close并加入节流控制throttle
,这样就能避免同时出现多个提示的问题。
引入节流和message提示组件:
window.netWorkFailDialog = null;
let netWorkFail = throttle(
function () {
window.netWorkFailDialog && window.netWorkFailDialog.close();
window.netWorkFailDialog = vm.$message({
message: "网络连接失败,请检查网络!",
type: "error",
duration: 4000
});
},
1000
);
在axios请求的Promise catch的时候调用
netWorkFail()
【vue解决频繁请求出现多个相同提示】
文章图片
推荐阅读
- 随笔|e.stopPropagation()在uni-app中无效,只能使用stop,所产生的问题
- 前端|uniapp开发微信小程序利用腾讯地图实现定位功能
- axios|axios封装 —— 动态加载、数据缓存
- 计算机网络|【前端vue——系列6】vue连接摄像头并实现摄像头暂停,计时,截图到本地等功能
- javascript|说一说实战项目升级从vue2到vue3 之main.js 区别
- 前端|稍微聊聊vue3的函数式编程
- 前端编译打包工具|Vite入门与了解
- Leetcode47全排列II(回溯+剪枝)
- vite + Vue3 + TS