Javascript 余烬组件泄漏状态

我是新来的灰烬和泄漏状态的问题。我有一个carousel小部件，它一次显示一个项目，允许用户单击上一个/下一个查看每个项目

以下是简化转盘的组件：

<button {{action "nextItem"}}>Next</button>
{{carousel-item item=selectedItem}}

以及使用CSS隐藏除所选项目之外的所有项目。然而，这个选项有点像jQuery黑客——似乎余烬会有更好的方法。我一次只显示一个项目，所以我讨厌在不需要的时候有这么多额外的DOM节点

---

如果一次只需要显示一个项目，但不想在项目之间共享状态，那么建议如何处理此类UI？我想我应该为每个项目提供一个

carousel项目

组件的实例，而不是在所有项目之间共享一个实例。但是，一开始就实例化每个

旋转木马项目也感觉不对。我无法想象余烬的方式是自己过于担心DOM细节（根据类和一些CSS确定显示/隐藏哪一个）。
首先，无论您使用什么框架或库，jQuery、余烬、angular、react，它们都只是JS/HTML/CSS包，对吗？所以你应该这样想，没有魔法

当然，一个组件只会创建一个实例。如果您只是更改了它的属性（演示中的项目），它只是更改了实例的属性，它的其他属性将保持原样并触发重新渲染。你不能期望更多。您必须手动重置其他属性

是的，通过
{{each}}
渲染所有内容看起来很愚蠢，但是想想看，如何通过只渲染一个DOM来创建平滑的旋转木马动画？至少需要渲染3（当前、上一个和下一个），对吗

由于carousel是一个常见的UI，我建议您在自己编写之前先检查现有的ember插件：
如果我正确理解了您的问题，ember.Component类中的钩子应该可以帮助您解决问题。我使用这个钩子，您可以清除属性、删除DOM对象或任何东西。每次组件将要重新渲染自身时，都将调用该函数

以下是一个简单的示例：

willUpdate() {
    Ember.$(this.get('element')).empty();
  },

这将在每次重新渲染时清除DOM，迫使其重新绘制元素

您也可以尝试其他挂钩，看看哪个事件将满足您的需要。所有这些都非常有用，并且有不同的用途。
我不明白您泄漏的实际状态是什么？状态不是从
项派生的吗？
willUpdate() {
    Ember.$(this.get('element')).empty();
  },