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 ...
随机推荐
- maven 下载jar失败: resolution will not be reattempted until the update interval of central has elapsed or updates are forced
Multiple annotations found at this line: - ArtifactTransferException: Failure to transfer com.faster ...
- AspxCallback和AspxCallbcakPanel区别
AspxCallback是一个无界面控件,主要功能是启动一个回调,进行数据交互,而AspxCallbcakPanel为一个容器控件,可以在里面添加控件,并且可以局部刷新AspxCallbcakPane ...
- 【转】Intro to ShockBurst/Enhanced ShockBurst
原地址https://devzone.nordicsemi.com/b/blog/posts/intro-to-shockburstenhanced-shockburst Wireless PC ac ...
- Lua脚本语法说明(转)
Lua脚本语法说明(增加lua5.1部份特性) Lua 的语法比较简单,学习起来也比较省力,但功能却并不弱. 所以,我只简单的归纳一下Lua的一些语法规则,使用起来方便好查就可以了.估计看完了,就懂得 ...
- Xcode 新建bundle id不同的且app图标也不同的新的target的步骤
方法一: duplicate一个target 修改target配置文件中的bundle id,app icon图标文件位置(必要时重命名app icon文件名),plist文件位置,entitleme ...
- css:自己实现一个带小图标的input输入框
有小图标的input输入框<input type="text" placeholder="输入手机号" style="background:ur ...
- 架构之微服务(zookeeper)转
ZooKeeper是一个分布式的,开放源码的分布式应用程序协调服务,它包含一个简单的原语集,分布式应用程序可以基于它实现同步服务,配置维护和命名服务等.Zookeeper是hadoop的一个子项目,其 ...
- java由字符型强制转化为整型例题
此Java程序依次输出参数,参数类型为字符型,要求更改程序,使得字符型强制转化为整形,并将这些整数相加,最后输出总和. 原程序: package demo; public class CommandP ...
- php运行代码流程和性能优化方法
---恢复内容开始--- php文件->扫描->zd引擎去理解->opcodes->执行->输出 例子,用white随机循环20000数据进行性能测试,分别对比isset ...
- 【357】sorted 函数高级用法
参考:Python 内置函数sorted()在高级用法 - Brad1994 - 博客园 sorted 函数主要实现的就是对于可迭代对象进行排序,对于一维数据排序很好理解与实现,直接调用即可,本文主要 ...