vue 定时器的问题
在项目中,我们经常会使用到定时器setInterval(),可是很多时候我们会发现,即使我退出当前页面,定时器依然在工作,非常消耗内存,所以我们要进行手动清理:
将定时器保存在变量中,退出页面时清除变量
1.定义空的变量
data: function (){
return {
timer: null
}
}
2.定义定时器
methods: {
setTimer: function () {
this.timer = setInterval( () => {
.....
}, 1000)
}
}
3.进入和退出时清除定时器
mounted() {
clearInterval(this.timer)
},
distroyed: function () {
clearInterval(this.timer)
}
vue 定时器的问题的更多相关文章
- vue定时器+弹框 跳到登陆页面
1.做一个请求拦截,并弹框提示几秒后,跳转到登陆首页或是点击确定之后直接跳转拦截用了this.$axios.interceptors.response页面上的弹框组件用了vux的组件vux地址:htt ...
- vue定时器
mounted(){ setInterval(this.getasks,1000 * 120); },
- vue离开页面销毁定时器
beforeDestroy() { if(this.timer) { clearInterval(this.timer); //关闭 } //利用vue的生命周期函数 vue 是单页面应用,路由切换 ...
- vue 项目中,定时器(setInterval)的写法
vue 项目中,定时器(setInterval)的写法: fetchJobList是一个方法,里面有dispatch一个action进行请求接口的代码. data () { return { inte ...
- Vue清除所有JS定时器
Vue清除所有JS定时器 在webpack + vue 的项目中如何在页面跳转的时候清除所有的定时器 JS定时器会有一个返回值(数字),通过这个返回值我们可以找到这个定时器 在vue项目中可以使用路由 ...
- VUE清除组件内部定时器
定时器如果不手动清除,只会在离开当前页面或者F5刷新后才会清除.由于vue项目是SPA应用,离开当前组件后并不会清除定时器,所以需要我们手动去清除定时器.但当我们将清除定时器clearInterval ...
- VUE笔记 - 插值表达式 v-on: / @ 事件绑定 定时器运用
<body> <!-- 2. 创建一个要控制的区域 --> <div id="app"> <input type="button ...
- vue中使用定时器时this指向
箭头函数中的this指向是固定不变(定义函数时的指向),在vue中指向vue; 普通函数中的this指向是变化的(使用函数时的指向),谁调用的指向谁. 箭头函数: let timerOne = s ...
- 清除定时器 和 vue 中遇到的定时器setTimeout & setInterval问题
2019-03更新 找到了更简单的方法,以setinterval为例,各位自行参考 mounted() { const that = this const timer = setInterval(fu ...
随机推荐
- 二级VB备考中
今天安装了一个VB软件,二级备考中,每天一套牌卷子. 在Html5中 align 与valign改变了属性 vertial-align 是垂直方向的改变 面对网站首页的建立需要首先画好一份区域设计图 ...
- DDD随笔-Axon
1. 命令处理程序从存储库中检索域对象(聚合)并执行它们的方法来更改它们的状态.这些聚合通常包含实际的业务逻辑,因此负责维护自己的状态.聚合的状态变化导致产生领域事件.领域事件和聚合形成领域模型. 2 ...
- Image.Url 无法使用 Server.MapPath(使用后无论如何也不显示)
Image.Url 无法使用 Server.MapPath(使用后无论如何也不显示)
- 机器学习进阶-人脸关键点检测 1.dlib.get_frontal_face_detector(构建人脸框位置检测器) 2.dlib.shape_predictor(绘制人脸关键点检测器) 3.cv2.convexHull(获得凸包位置信息)
1.dlib.get_frontal_face_detector() # 获得人脸框位置的检测器, detector(gray, 1) gray表示灰度图, 2.dlib.shape_predict ...
- mongodb学习-练习实例
C:\Users\issuser>mongoMongoDB shell version: 2.4.6connecting to: test> db.user.find(){ "_ ...
- java实现生成二维码
package com.cn.test; import java.awt.Graphics2D; import java.awt.geom.AffineTransform; import java.a ...
- Windows下MongoDB安装配置
一.安装 官网下载,一般选择community server版本下载,如果是企业可以选择enterprise版本,个人使用的话community就可以了,附上链接:https://www.mongod ...
- Jupyter-1-安装Anaconda3及更改路径
Jupyter Notebook测试Python3,可以将图文.代码有效融合,进行交互式编程,适合学习讲解及方案沟通. 1.下载Anaconda3 可以到官网或是清华大学软件镜像站去下载. 路径:ht ...
- java输出自身源代码
如何通过运行程序输出程序源码? 下面是JAVA实现 public class Quine { public static void main(String[] args) { char q = 34; ...
- unzip解压带密码的压缩包
// 解压 String pw = "123456"; String cmd = "unzip -P " + pw + " /root/lianlia ...