Question

这是一个Ember组件，在某些时候需要this：

export default Component.extend({
  filteredSubs: computed.filter('model.subs', function() {
    // this will always return true in development http://localhost:4200/dummy
    // but will always return false in test because 'this' becomes undefined
    return this;
  })
});

Dummy与Sub有一对多的关系：

export default Model.extend({
  subs: hasMany('sub')
});

export default Model.extend({
  dummy: belongsTo('dummy')
});

此测试失败但不应该：

test('it renders', function(assert) {
  let dummy = server.create('dummy');
  server.create('sub', { dummy });

  this.set('dummy', dummy);
  this.render(hbs`{{show-dummy model=dummy}}`);

  assert.equal(this.$().text().trim(), 'Hi! There are 1 sub-dummies');
});

不行13 Chrome 63.0 - 集成|组件| show dummy：它呈现

实际：嗨！有0个子假人
     预计：嗨！有1个子假人

不确定这可能是Ember bug还是ember-cli-mirage bug，
我已在新的回购https://github.com/stephanebruckert/ember-bug-16052
也发布在https://github.com/emberjs/ember.js/issues/16052

Answer 1

你的问题来自一个不幸的假设序列。

您的第一个假设是Ember.computed.filter内的this应该是相应的对象。我不是100％确定这是记录在案的行为，并且个人不会依赖它。如果您需要完全访问Ember.computed，我会使用简单的model。

然而，您的主要错误在于您的测试。这也解释了为什么你在测试中只有这个问题。您直接将海市蜃楼模型用作组件的let dummy = server.create('dummy'); server.create('sub', { dummy }); this.set('dummy', dummy); this.render(hbs`{{show-dummy model=dummy}}`);：

server.create

在这里，您假设海市蜃楼模型ember-data的结果在某种程度上类似于ember模型。 不是！事实上，海市蜃楼模型甚至不是.get对象！因此，您不能在其上使用.set或ember-data，或者您在模型上定义的任何内容，并且绝对不应该将其用作组件测试的模型。相反，您应该使用海市蜃楼作为this模型的数据源。

如果您的模型是海市蜃楼模型，filter(f) { let filteredModels = this.models.filter(f); return new Collection(this.modelName, filteredModels); }未定义的原因导致this line in ember-cli-mirage：

this

.filter - 上下文丢失的地方。基本上海市蜃楼会覆盖其自定义数组结构上的this函数，并且不会确保保留{{1}} - 上下文。

'this'仅在组件集成测试中未定义

1 个答案: