Javascript 余烬数组更新-无法读取属性'；摧毁'；未定义的

如何更新余烬数组，使数组中的更改也会导致视图中的更改

这里有一些伪代码-

cacheArr: Em.A([]),
count: 1,
updateFxn: function() {
    this.incrementProperty(count);
    devObj = Ember.object.create();
    Ember.set(devObj,"ts", this.count);
    this.cacheArr.replace(0,1, [devObj]);
},


App.ArrayComponent = Ember.Component.extend({
  refresh: function() {
    return cacheArr;
  }.property('localModel.length')
});

<script type="text/x-handlebars" id="components/new-comp">
      {{#each item in refresh}}
         {{item.ts}}
      {{/each}}
</script>

cacheArr:Em.A（[]），
计数：1，
updateFxn:function（）{
此.incrementProperty（计数）；
devObj=Ember.object.create（）；
余烬集（devObj，“ts”，this.count）；
此.cacheArr.replace（0,1[devObj]）；
},
App.ArrayComponent=Ember.Component.extend({
刷新：函数（）{
返回cacheArr；
}.property（'localModel.length'））
});
{{{#刷新中的每个项目}
{{item.ts}
{{/每个}}

---

我很困惑，为什么我会得到无法读取未定义属性“destroy”的异常？我一直在寻找答案，但没有找到。欣赏见解。

如果您使用正确的方法（获取/设置等），Ember会观察并更新内容。对于数组，您需要使用类似的setter/getter（pushObject/removeObject/replace/objectAt等）

因此，在创建计算属性时，通常希望它们监视可以更改计算属性结果的项目。让我们剖析以下计算属性

refresh: function() {
  return cacheArr;
}.property('localModel.length')

让我们举一个例子：

// let's grab refresh
var refresh = this.get('refresh');

console.log(refresh);

// let's change localModel which would make refresh dirty

this.get('localModel').pushObject({foo:'bar'});

var refresh2 = this.get('refresh');

此时，

refresh

和

refresh2

将完全相同，因为computed属性始终返回

cacheArr

（某些全局属性）

---

什么是DevBj？它看起来像一个全局变量，您将用该全局对象替换该数组中的任何第一项。这与组件有什么关系？即使您使用“伪”CodeDevBj谈论的内容不是全局变量，也很难理解。它是在updateFxn中创建的一个余烬对象。我已经相应地更新了这个问题。要点是使用devObj在不同的时间点以不同的索引更新数组中的项。组件将此数组传递给模板，以获得更新的视图。因此，当数组对象更新时，UI将更新。如果这还不清楚，请告诉我。这仍然是全球性的定义，但一切都很好。我将创建一个例子，希望能对您有所帮助，我不确定我是否仍然完全理解始终替换第一个项目，但可能这只是一些无关的事情。我也不确定该组件是否有意义，因为它与模板名称不匹配

// let's grab refresh
var refresh = this.get('refresh');

console.log(refresh);

// let's change localModel which would make refresh dirty

this.get('localModel').pushObject({foo:'bar'});

var refresh2 = this.get('refresh');