如何正确使用＆＃39; didInsertElement＆＃39;在我的情况下？

Question

我有以下组件代码（省略了实际内容）：

App.DataTableComponent = Ember.Component.extend({    
    test: function(){
        ...
    }.property('data')
});

我不希望在插入组件之前测试可用，但我也将数据传递给它。如果我没有插入数据，而不是.property（'data'），我会去.on（'didInsertElement'）。如果两者都需要发生怎么办？

Answer 1

第一种方法

仅在插入组件时返回值：

App.DataTableComponent = Ember.Component.extend({    
  onInsert: function() {
    this.set('isInserted', true);
  }.on('didInsertElement'),

  test: function(){
    if (this.get('isInserted')) {
      // compute the test property here
      var someValue = this.get('data') + 5;
      return someValue;
    }
  }.property('data', 'isInserted')
});

---

第二种方法

在插入组件后定义计算属性：

App.DataTableComponent = Ember.Component.extend({    
  onInsert: function() {
    Ember.defineProperty(this, 'test',
       Ember.computed(this.testComputer).property('data')
    );
  }.on('didInsertElement'),

  testComputer: function(){
    // compute the test property here
    var someValue = this.get('data') + 5;
    return someValue;
  }
});