美文网首页
vue定时任务的设置和取消

vue定时任务的设置和取消

作者: 正强Strong | 来源:发表于2021-05-06 16:13 被阅读0次

vue偶尔也会用到定时的取更新点内容之类的需求,比如最近遇到的就是每个约1分钟更新一下列表的内容。
主要就是利用created和beforeDestroy这两个回调,来创建定时器和清除定时器。

1、created函数里面,初始化一下定时器

这里的onSearch函数会每60s被调用一次,去后台获取内容。

  created() {
    this.timer = setInterval(() => {
      this.onSearch(this.pageinfo.params, this.pageinfo.current);
      this.closeExcelImportUploadDetailDialog();
    }, 1000 * 60);    
  },

2、methods里面增加一个clearTimer的函数

    clearTimer() {
      if(this.timer) {
        clearInterval(this.timer);
        this.timer = null;
      }
    }

3、最后在beforeDestroy()生命周期内清除定时器

之后就不会看到每60s调用一次对onSearch函数的调用

  beforeDestroy() {
    // debugger;
    this.clearTimer();
  },

相关文章

  • vue定时任务的设置和取消

    vue偶尔也会用到定时的取更新点内容之类的需求,比如最近遇到的就是每个约1分钟更新一下列表的内容。主要就是利用cr...

  • Netty的定时任务

    当channel不是active的时候其对应的定时任务也会取消定时任务执行的时候会先设置uncancellble ...

  • Android实现定时任务

    碰到一个简单的需求:执行一个耗时任务,超过预设的最长时间后则取消这次任务,即在任务开始时设置一个定时器,超过指定时...

  • Netty的定时器

    Netty的定时器 取消定时任务: 调用Timeout.cancel().

  • 2019-07-31定时任务

    定时任务 定时任务实现方法 系统默认定时任务 用户自定义设置定时任务 定时任务配置文件 定时任务启动 定时任务样例...

  • day 22 操作系统定时任务

    系统定时任务概念==生活中闹钟 系统定时任务实现方法: 实现定时任务配置: 定时任务如何进行设置 定时任务编写常见...

  • [记录]Flink中取消job时没有关闭springApplic

    写了一个Flink程序, 加载spring, 运行定时任务, 定时任务正常运行, 但是在取消掉job后发现定时任务...

  • crontab 定时任务

    查看当前用户的定时任务列表 创建(编辑)定时任务列表 定时任务格式 删除定时任务 注意 一定要设置crontab的...

  • ios开发小技巧总结(一)

    1.设置标签的文字显示不同颜色。 2.定时器的取消,关闭,重启(1).设置定时器。 (2).定时器关闭 [_t...

  • AlarmManager 设置和取消定时器 实例

    使用 AlarmManager 设置定时器的方法如下: 使用 AlarmManager 取消定时器的方法如下: 下...

网友评论

      本文标题:vue定时任务的设置和取消

      本文链接:https://www.haomeiwen.com/subject/tfmufltx.html