vue 如何清除定时器
在页面中需要定时刷新局部数据,在数据变化是否频繁的情况下,没有必要使用webSocket,因为数据变化频繁,数据实时变化太快看不清楚。因此页面会定时调用后台接口以达到实时刷新数据的效果。
1、在data中定义一个定时器变量,timer
2、在mounted中把定时器的复制为timer
3、页面离开时,在destroyed中清除定时器已经timer
data() {
return {
timer:null, //定时器名称
}
},
created() {
this.getHangTotal();
},
mounted() {
this.timer = setInterval(
this.getHangTotal,
);
},
destroyed(){
clearInterval(this.timer); // 清除定时器
this.timer = null;
},
methods: {
getHangTotal(){
//…………
}
}
vue 如何清除定时器的更多相关文章
- vue+js清除定时器
注意data数据里面一定要定义Timeout Timeout:Function,//定时器 methods里面 moseovefalse(){//需要执行的方法 var that=this; that ...
- vue中清除定时器
1.data中定义 timer:90,timeName:null 点击支付则倒计时按钮出来 pay(){ this.timeName= setInterval(()=>{ this.timer- ...
- 清除定时器 和 vue 中遇到的定时器setTimeout & setInterval问题
2019-03更新 找到了更简单的方法,以setinterval为例,各位自行参考 mounted() { const that = this const timer = setInterval(fu ...
- 在vue组件中设置定时器和清除定时器
由于项目中难免会碰到需要实时刷新,无论是获取短信码,还是在支付完成后轮询获取当前最新支付状态,这时就需要用到定时器.但是,定时器如果不及时合理地清除,会造成业务逻辑混乱甚至应用卡死的情况,这个时就需要 ...
- Vue中在组件销毁时清除定时器(setInterval)
在mounted中创建并执行定时器,然后在beforeDestroy或者destroyed中清除定时器 <template> <div class="about" ...
- vue中使用定时器时this指向
箭头函数中的this指向是固定不变(定义函数时的指向),在vue中指向vue; 普通函数中的this指向是变化的(使用函数时的指向),谁调用的指向谁. 箭头函数: let timerOne = s ...
- angualrJs清除定时器
angualrJs清除定时器爬坑之路: 今天发现一个奇怪问题,放在自定义指令里边的定时器竟然在页面跳转之后,在另一个页面这个循环定时器还在执行,这肯定是不行的,会影响系统的性能. 我在angular里 ...
- setTimeout和setInterval实现滚动轮播中,清除定时器的思考
PS:希望各路大神能够指点 setTimeout(function,time):单位时间内执行一次函数function,以后不执行:对应清除定时器方法为clearTimeout; setInterva ...
- vue组件里定时器销毁问题
我在a页面写一个定时,让他每秒钟打印一个1,然后跳转到b页面,此时可以看到,定时器依然在执行.这样是非常消耗性能的.如下图所示: 解决方法1: 首先我在data函数里面进行定义定时器名称: data( ...
随机推荐
- HDU 1912
坑,直接把公路看成X轴来做,然后,排序扫描一下,你懂的. #include <iostream> #include <algorithm> #include <cstdi ...
- 怎样手动的干净的删除linux上的ORACLE数据库
近期在用VMWARE虚拟机做ORACLE的数据库实验.我们都知道在WINDOWS上,我能够到加入删除程序里去自己主动删除已经安装的全部的应用程序.可是在LINUX上没有这个服务能够进行自己主动的删除. ...
- 程序中的文件之沙盒以及plist文件的初步使用
沙盒是相对于"应用程序"的文件,也就是相相应app所在的页面的文件. 每个应用都有自己的应用沙盒(应用沙盒就是文件系统文件夹).与其它文件系统隔离.应用必须呆在在积极的沙盒中.其它 ...
- 南海区行政审批管理系统接口规范v0.3(规划)4.1.【queryAcceptById】业务明细查询
加密前:{"time":"1510061005493","username":"GH_DATA_EXCHANGE",&q ...
- Windows显示我的电脑到桌面以及给一些程序设置快捷键
Windows显示我的电脑到桌面,我测试的是windows server 2012和windows10 1.按Win(键盘上的微软徽标键)+R,输入: rundll32.exe shell32.dl ...
- Hadoop MapReduce编程 API入门系列之挖掘气象数据版本3(九)
不多说,直接上干货! 下面,是版本1. Hadoop MapReduce编程 API入门系列之挖掘气象数据版本1(一) 下面是版本2. Hadoop MapReduce编程 API入门系列之挖掘气象数 ...
- jar运行main函数的方法
当把java项目打包成jar后,如何运行main函数呢? 第一种:指定运行类: java -cp test.jar com.ming.test.Test 第二种:在MANIFEST.MF里配置了Mai ...
- Codeforces Round #447
QAQ #include<stdio.h> #include<string.h> #include<stdlib.h> #include<vector> ...
- Git Learning Part III - working remotely (Github)
help document of Github : https://help.github.com/ 1 upload 1.1 new update Initialize a repository ...
- 利用a链接发送电子邮件
实例代码: <a href="mailto:name1@rapidtables.com?cc=name2@rapidtables.com&subject=你好%20我是&quo ...