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( ...
随机推荐
- 《随笔》pyqt 获取 TreeWidget 选中项的内容
感谢朋友支持本博客,欢迎共同探讨交流.因为能力和时间有限,错误之处在所难免.欢迎指正! 假设转载,请保留作者信息. 博客地址:http://blog.csdn.net/qq_21398167 原博文地 ...
- dwr异常处理
配置异常转换器: dwr.xml: <!-- 异常转换 --> <convert match="java.lang.Exception" converter=&q ...
- udev的使用-minicom没有权限打开串口,更改 ttyUSB0 的权限
udev的使用-minicom没有权限打开串口,更改 ttyUSB0 的权限 使用minicom打开串口会提示没有权限,必需要用 sudo,怎样更改串口设备的权限能够让普通用户读写呢? 事实上仅仅要更 ...
- 计算工作日之后N天的日期
1.假期实体类: package com.smics.date; import java.io.Serializable; import java.util.Date; public class Va ...
- 常用框架(一):spring+springMvc+mybatis+maven
项目说明: (1) 本例采用 maven web 工程做例子讲解 (2) 利用mybaits 提供的代码生成工具自动生成代码(dao接口,sql mapper映射文件,pojo数据库映射类) (3) ...
- ReflectionSugar 通用反射类
http://www.cnblogs.com/sunkaixuan/p/4635710.html
- Node.js:template
ylbtech-Node.js: 1.返回顶部 2.返回顶部 3.返回顶部 4.返回顶部 5.返回顶部 6.返回顶部 作者:ylbtech出处:http://ylbtech ...
- 建模:3D建模
ylbtech-建模:3D建模 “3D建模”通俗来讲就是通过三维制作软件通过虚拟三维空间构建出具有三维数据的模型.3D建模大概可分为:NURBS和多边形网格. NURBS对要求精细.弹性与复杂的模型有 ...
- Ubuntu搭建docker环境
一丶自己搭建Ubuntu的虚拟机(网上很多教程) PS:下带图形化界面的Ubuntu镜像,这里只说一下要装那些工具和做那些配置 安装vim sudo apt-get install ...
- cloudfoundry service broker 制作
实验室这边需要制作service broker.从今天开始将精力投入其中.