模板被销毁时正确停止 autorun() 函数答案

【问题标题】：Correctly stopping an autorun() function when template is destroyed模板被销毁时正确停止 autorun() 函数
【发布时间】：2015-11-19 20:31:36
【问题描述】：

我有一个包含图表的模板，使用 MorrisJS 呈现。当 currentData 会话变量更改时，图表应该会更新，因此我将其设置为反应式数据源：

Template.chart.rendered = function() {

    var template = this;

    Deps.autorun(function(c) {

        // Stop if the template is removed from the dom
        // Q: Is this really right?
        if(template.__component__.dom.parentNode() === null) {
            c.stop();
            return;
        }

        var results = Session.get('currentData');

        // ... render a chart with `results` as the data

        Morris.Bar({element: template.$(".chart-container"), data: results, ...});

    });

};

请注意我是如何对何时停止上面的自动运行进行相当可怕的检查的。这是必要的，因为如果没有这个，当我使用模板（我正在使用iron-router）从页面导航到另一个页面并返回时，我会在日志中收到警告，例如“无法在已删除的 DomRange 中选择”。我很确定这是因为模板实例已删除，但自动运行仍在运行。

不过，我觉得我在这里做错了什么。是否有 (a) 放置自动运行的更好位置以便它不存在此问题或 (b) 从 DOM 中删除模板实例时停止计算的更好方法？

我试图找到一种使用 created 和 destroyed 处理程序的方法，但我不知道如何。

【问题讨论】：

标签： meteor

【解决方案1】：

Tracker.autorun 返回一个句柄，您可以将其存储为模板实例属性，然后在onDestroyed 生命周期事件中调用其stop 方法。

Template.chart.onRendered(function(){
  this.computation = Tracker.autorun(function(){...});
});

Template.chart.onDestroyed(function(){
  this.computation.stop();
});

编辑 29-09-2014

在较新版本的 Meteor（0.9 及更高版本）中，模板实例上提供了一个新的 autorun 函数，它提供了更简单的代码来实现相同的结果：无需手动存储和停止计算，这一点已得到处理由框架决定。

Template.chart.onRendered(function(){
  this.autorun(function(){...});
});

【讨论】：

为了与销毁的方法保持一致，当它作为自动运行回调参数提供时存储计算的引用（而不是从 Deps.autorun 的返回值获取它）
@matb33 - 你为什么这么说？ saimeunt 的解决方案似乎有效（起初我认为它没有，但我看到的错误是红鲱鱼）。
在新的Meteor中我还是想停止自动运行并重新开始，我该怎么做？

【解决方案2】：

使用新的自动运行

Template.chart.onRendered(function(){
  this.autorun(function(computation){
    ...
    computation.stop();
  });
});

但是使用此自动运行，当图表模板从 DOM 中删除时，它会自动删除。这是流星文档here：

当模板被销毁时，计算会自动停止。

【讨论】：