在项目中,我们经常会使用到定时器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 定时器的问题的更多相关文章

  1. vue定时器+弹框 跳到登陆页面

    1.做一个请求拦截,并弹框提示几秒后,跳转到登陆首页或是点击确定之后直接跳转拦截用了this.$axios.interceptors.response页面上的弹框组件用了vux的组件vux地址:htt ...

  2. vue定时器

    mounted(){ setInterval(this.getasks,1000 * 120); },

  3. vue离开页面销毁定时器

    beforeDestroy() { if(this.timer) { clearInterval(this.timer); //关闭 }  //利用vue的生命周期函数 vue 是单页面应用,路由切换 ...

  4. vue 项目中,定时器(setInterval)的写法

    vue 项目中,定时器(setInterval)的写法: fetchJobList是一个方法,里面有dispatch一个action进行请求接口的代码. data () { return { inte ...

  5. Vue清除所有JS定时器

    Vue清除所有JS定时器 在webpack + vue 的项目中如何在页面跳转的时候清除所有的定时器 JS定时器会有一个返回值(数字),通过这个返回值我们可以找到这个定时器 在vue项目中可以使用路由 ...

  6. VUE清除组件内部定时器

    定时器如果不手动清除,只会在离开当前页面或者F5刷新后才会清除.由于vue项目是SPA应用,离开当前组件后并不会清除定时器,所以需要我们手动去清除定时器.但当我们将清除定时器clearInterval ...

  7. VUE笔记 - 插值表达式 v-on: / @ 事件绑定 定时器运用

    <body> <!-- 2. 创建一个要控制的区域 --> <div id="app"> <input type="button ...

  8. vue中使用定时器时this指向

    箭头函数中的this指向是固定不变(定义函数时的指向),在vue中指向vue; 普通函数中的this指向是变化的(使用函数时的指向),谁调用的指向谁.   箭头函数: let timerOne = s ...

  9. 清除定时器 和 vue 中遇到的定时器setTimeout & setInterval问题

    2019-03更新 找到了更简单的方法,以setinterval为例,各位自行参考 mounted() { const that = this const timer = setInterval(fu ...

随机推荐

  1. Pig latin基础

    pig的两种运行模式,local模式,mapreduce模式 local模式下,pig只能访问本地一台:在mapreduce模式下,pig可以访问一个hadoop集群和hdfs的安装位置.这时,pig ...

  2. 使用Shiro登录成功后,跳转到之前访问的页面实现

    转:http://blog.csdn.net/lhacker/article/details/20450855 很多时候,我们需要做到,当用户登录成功后,跳转回登录前的页面.如果用户是点击" ...

  3. Linux 文件查找(find)

    find(选项)(参数) 选项 -amin<分钟>:查找在指定时间曾被存取过的文件或目录,单位以分钟计算: -anewer<参考文件或目录>:查找其存取时间较指定文件或目录的存 ...

  4. android stuido的代码排版的快捷建CTRL+ALT+L

    CTRL+ALT+L 需要主要留意的地方是QQ的与其冲突的 我将qq的中快捷方式给去除

  5. 【Linux】CentOS7 安装,遇到的各种问题,并修复win7启动项

    https://www.cnblogs.com/sxdcgaq8080/p/7457255.html ------------------------------------------------- ...

  6. Photoshop 辅助线和标尺的使用技巧

    1.拖动辅助线时按住Alt键可以在水平辅助线和垂直辅助线之间切换.按住Alt键点击一条已经存在的垂直辅助线可以把它转为水平辅助线,反之亦然. 注意:辅助线是通过从标尺中拖出而建立的,所以要确保标尺是打 ...

  7. Excel快捷生成想要的xml或text

    1.新建一个xml格式的A.xml文本,里面有4条以上的内容,注意哦,里面的元素与Excel里面的标题列数是一直的,不然会少了对应的某列数据.如: 2.打开Excel——>新建一个sheetl— ...

  8. VirtualBox安装增强工具方法

    1.http://blog.csdn.net/wuliowen/article/details/71541561 2.https://segmentfault.com/a/11900000062335 ...

  9. python中pop()函数的用法

    pop() 函数用于移除列表中的一个元素(默认最后一个元素),并且返回该元素的值. 语法:list.pop(obj=list[-1]) //默认为 index=-1,删除最后一个列表值. obj -- ...

  10. guava collection/cache初探

    写了上面一篇,看了点eventbus相关的guava代码后,发现里面用到了很多其他guava包里的方法,所以顺着看一下,比如之前用到的map都是guava自己的 Multimap:可以包含有几个重复K ...