Javascript Ember.js-组件内部模型

我制作一个应用程序只是为了练习，我对组件的功能“didReceiveAttr”有疑问。当我在模板中传递模型，然后删除其中的某些元素时，函数不起作用，但是如果我在模板中传递“MODEL.length”，然后删除某些元素，函数就起作用了

我的组件模板

<h1>Tasks ({{totalTask}})</h1>

我的主模板

{{task-list model=model}}

或

---

这确实是预期的行为；只要看看

didReceiveAttrs

是如何工作的。它清楚地说明了“

didReceiveAttrs

hook在每次组件的属性更新时都被调用”。向数组中添加或从中删除时，数组本身不会更改；因此，不会执行

didReceiveAttrs

。仅当执行了对

模型的初始分配时，才会执行该命令

我准备这篇文章是为了向你们展示一种更好的方式来处理这个案件。您应该尽可能地依赖计算属性；因此，我将
computedTotalTask
作为计算属性添加到
my component.js
中，正如您所见，它依赖于
model.length
。
这确实是预期的行为；只要看看
didReceiveAttrs
是如何工作的。它清楚地说明了“
didReceiveAttrs
hook在每次组件的属性更新时都被调用”。向数组中添加或从中删除时，数组本身不会更改；因此，不会执行
didReceiveAttrs
。仅当执行了对
模型的初始分配时，才会执行该命令

{{task-list modelLength=model.length}}

我准备这篇文章是为了向你们展示一种更好的方式来处理这个案件。您应该尽可能地依赖计算属性；因此，我将
computedTotalTask
作为计算属性添加到
my component.js
中，如您所见，它依赖于
model.length

{{task-list modelLength=model.length}}

在这里，您将
model.length
指定为组件的
modelength
属性。因此，最初在组件接收
modelength
属性时将调用didReceiveAttrs，当您向模型中添加一个元素时，
modelength
属性本身将发生更改，因此在重新渲染之前将调用
didReceiveAttrs

{{task-list modelTaskList=model}}

这里modelTaskList指向数组，所以当您通过兼容KVO的方法（如pushObject）添加/删除项时，它也将反映在组件中。但是modelTaskList仍然指向同一数组，因此不会调用didReceiveAttrs钩子。
假设您分配了不同的数组，那么您可以看到调用了didReceiveAttrs

在这里，您将
model.length
指定为组件的
modelength
属性。因此，最初在组件接收
modelength
属性时将调用didReceiveAttrs，当您向模型中添加一个元素时，
modelength
属性本身将发生更改，因此在重新渲染之前将调用
didReceiveAttrs

{{task-list modelTaskList=model}}

这里modelTaskList指向数组，所以当您通过兼容KVO的方法（如pushObject）添加/删除项时，它也将反映在组件中。但是modelTaskList仍然指向同一数组，因此不会调用didReceiveAttrs钩子。
假设您分配了不同的数组，那么您可以看到调用了didReceiveAttrs。
您可以始终将其设置为计算属性，以确保在绑定变量被更新时进行更新

在组件中，设置一个计算属性，该属性将监视模型的更改，然后使用更改更新变量
modelength

modelLength: Ember.computed('model', function(){
  return this.get('model').length;
}

然后，在车把模板中，引用此长度

<h1>Tasks{{#if modelLength}} ({{modelLength}}){{/if}}</h1>

Tasks{{{if modelength}（{{modelength}}）{{/if}
您始终可以将其设置为计算属性，以确保在绑定变量被更新时进行更新

在组件中，设置一个计算属性，该属性将监视模型的更改，然后使用更改更新变量
modelength

modelLength: Ember.computed('model', function(){
  return this.get('model').length;
}

然后，在车把模板中，引用此长度

<h1>Tasks{{#if modelLength}} ({{modelLength}}){{/if}}</h1>

Tasks{{{if modelength}（{{modelength}}）{{/if}
我想你的问题是为什么会发生这种情况？我试着在我的回答中解释它。希望这有帮助。我想你的问题是为什么会发生这种情况？我试着在我的回答中解释它。希望这有帮助。是的，我知道DeDeAccess只在更新时调用，这就是为什么我感到困惑，因为我认为（删除任务）对模型长度的更新，并且应该调用函数抱歉，我没有得到你所困惑的。正如我所解释的，官方指南说，
didReceiveAttrs
只在属性更新时执行。添加/删除阵列不会更新阵列本身；但是数组的长度会被更新。所以如果以属性
didReceiveAttrs
的形式传递数组，则在添加/删除项时不会触发该属性。如果传递数组的长度；由于添加/删除项目会改变长度
didReceiveAttrs
按预期执行。感谢您的回复，是的，我现在知道了，问题是我看到模型的长度就像一个属性，当我在模型中删除或添加某些内容时，该属性（长度）被更新，因此必须调用函数，但我看到不合适。我很高兴您得到了它；别忘了接受/支持对你有帮助的答案。是的，我知道DeDeAccess只在更新时调用，这就是为什么我感到困惑，因为我认为（删除任务）对模型长度的更新，并且应该调用函数“对不起”，我没有得到你所困惑的。正如我所解释的，官方指南说，
didReceiveAttrs
只在属性更新时执行。添加/删除阵列不会更新阵列本身；但是数组的长度会被更新。所以如果你通过