流星:如何清除在onrender()中创建的onDestroyed()

Meteor : How to clearInterval() onDestroyed() created in onRendered()

本文关键字:onrender 创建 onDestroyed 清除 何清除 流星      更新时间:2023-09-26

我有一个每秒运行的倒计时函数,所以我提供了setInterval()。当我移动到另一个模板后,区间函数继续运行。如何摧毁它,onDestroyed()。下面的代码将帮助您更好地理解。

<template name="Home">
    <h4>{{timeremaining}}</h4>
</template>

Template.Home.helpers({
  timeremaining : function(){
    return Session.get('timeremaining');
  }
});
Template.Home.onRendered(function () {
      // time functions begin
      var end_date = new Date(1476337380000); // I am getting timestamp from the db.
      var run_every_sec = setInterval(function () {
        var current_date = new Date();
        var remaining = end_date.getTime() - current_date.getTime();
        var oneDay = 24*60*60*1000;
        var diffDays = Math.round(Math.abs(remaining/oneDay));
        console.log(remaining); // am getting this log in every template.
        if (remaining > 0) {
          //set remaining timeLeft
          Session.set('timeremaining',diffDays + ' Days ' + (Math.abs(end_date.getHours()-current_date.getHours())).toString() + ' Hrs ' + (Math.abs(end_date.getMinutes()-current_date.getMinutes())).toString() + ' Min ' + (60 - end_date.getSeconds()-current_date.getSeconds()).toString() + ' Sec ')
        } else {
          clearInterval(run_every_sec);
        }
      }, 1000);
      //time functions end

}.bind(this));
Template.Home.onDestroyed(function () {
  clearInterval(run_every_sec); // Here I cant remove this time interval
});

可以将run_every_sec声明为全局函数。如果有,如何通过end_date。我不认为在run_every_sec中声明end_date是明智的,因为它来自db。

如果您像Repo建议的那样将间隔存储在文件作用域中,那么如果一次有多个模板实例,则会出现问题:两个实例将使用相同的run_every_sec变量。在这种情况下,您需要将间隔存储在模板实例上,可以在onRenderedonDestroyed中作为this访问该实例:

Template.Home.onRendered(function () {
    this.run_every_sec = setInterval(/* ... */);
});
Template.Home.onDestroyed(function () {
    clearInterval(this.run_every_sec);
});

这样,每个模板实例都有自己的run_every_sec属性

你应该在" onrender "之外声明"run_every_sec"

所以不用这个:

Template.Home.onRendered(function () {
      // time functions begin
      var end_date = new Date(1476337380000); // I am getting timestamp from the db.
      var run_every_sec = setInterval(function () {

. .这样做:

var run_every_sec;
Template.Home.onRendered(function () {
      // time functions begin
      var end_date = new Date(1476337380000); // I am getting timestamp from the db.
      run_every_sec = setInterval(function () {

那么它将在"onDestroyed"中可用

您应该使用Meteor的setInterval和clearInterval来确保它们在光纤中运行。你可以在这里找到更多的信息https://docs.meteor.com/api/timers.html。

var intervalID
Template.myTemplate.onRendered(function() {
    intervalID = Meteor.setInterval(function() {
        //do something
    }, 1000)
})
Template.myTemplate.onDestroyed(function() {
    Meteor.clearInterval(intervalID)
})