使用 es6 时，Meteor 模板自动运行不是一个功能

Question

作品

Template.Hello.onRendered(function() {
  this.autorun(() => {
    console.log('sup');
  });
});

不起作用。

Template.Hello.onRendered(() => {
  this.autorun(() => {
    console.log('sup');
  });
});

错误为 TypeError: _this.autorun 不是函数。

知道为什么使用箭头表示法会给我们带来这个错误吗？

Answer 1

箭头函数使用 this 的词法绑定(bind)，这意味着 this 将是创建函数时的任何内容。不幸的是，这意味着您在使用对象属性(例如模板)的对象上创建函数时无法使用它。

一个小例子是这样的:

o = {};
o.fn = () => console.log(this);
o.fn(); // not 'o'

o.fn = function () { console.log(this); }
o.fn(); // 'o'

.autorun 是模板的一个方法，因此需要 this 的功能绑定(bind)。

有时箭头函数的词法绑定(bind)很有用，例如在 autorun 的回调中。在这种情况下，您希望 this 与外部作用域保持相同。否则你必须绑定(bind)它:

Template.Hello.onRendered(() => {
  this.autorun(() => {
    console.log(this); // the template
  });
  this.autorun(function () {
    console.log(this); // the template
  }.bind(this));
  this.autorun(function () {
    console.log(this); // the callback function
  });
});