每隔几秒请求一次接口
轮询 - 每隔几秒请求一次接口实现数据更新
单纯使用setInterval会使页面卡死,setTimeout自带清除缓存,组合使用实现轮询可解决浏览器崩溃.
<template> <div> <button @click="dataset_log">test</button> <ul> <li v-for="(item, index) in data" :key="index">{{ item }}</li> </ul> </div> </template> <script> export default { props: ['getData','data'], name: 'exe', data() { return { timer: null, num: 0, } }, destroyed() { //离开页面是销毁 clearInterval(this.timer); this.timer = null; }, mounted(){ this.timer = window.setInterval(() => { console.log("timer") console.log(this.timer) setTimeout(this.dataset_log(), 0); }, 3000); }, methods: { dataset_log() { this.getData("send request dataset log") console.log("请求" + this.num++ + "次"); if(this.num==8){ this.stop() } }, stop() { clearInterval(this.timer); this.timer = null; this.num = 0 }, }, } </script>
相当于自动点击按钮,向后端发起请求。
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 周边上新:园子的第一款马克杯温暖上架
· Open-Sora 2.0 重磅开源!
· .NET周刊【3月第1期 2025-03-02】
· 分享 3 个 .NET 开源的文件压缩处理库,助力快速实现文件压缩解压功能!
· [AI/GPT/综述] AI Agent的设计模式综述
2020-08-10 tar 命令