无法理解模型更改时更新 UI 的过程
我有一系列模型。当模型更改时,它会触发集合上的更改事件。我观察集合更改事件,然后更新 UI。
我应该如何更新 UI?我不需要知道哪些模型是新的,以便我可以追加,以及哪些模型已经存在,以便我可以更新吗?
我觉得需要这种粒度的原因之一是因为有一个动画过渡,所以我需要将每个模型与其之前的状态相关联。骨干网对此有帮助还是我应该自己构建这个?
I have a collection of models. When a model changes it triggers a change event on the collection. I watch for the collection change event and then I update the UI.
How should I go about updating the UI? Don't I need to know what models are new, so I can append, and what already exist, so I can update?
One of the reason I feel I need this granularity is because there's an animation transition, so I need to relate every model to it's previous state. Does backbone help with this or should I just build this on my own?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
要了解哪些型号是新的,请收听该系列的“添加”事件。然后您可以渲染单个项目。
在此示例中,呈现集合的工作方式与呈现单个项目相同 - 它调用“add”事件调用的相同 renderItem 方法。
要处理有排序列表的情况...您必须在 renderItem 方法中执行一些逻辑来找出项目的位置。可能是这样的(未经测试的代码......只是一个想法):
此代码假设您的模型上有一个索引属性,以了解模型应该采用的顺序。
另请注意,此代码获胜的可能性很高不按原样执行,因为我还没有对其进行测试。但它应该让您了解您想要编写的代码。
to know which models are new, listen to the collection's "add" event. then you can render the individual item.
in this example, rendering the collection works the same as rendering an individual item - it calls the same renderItem method that the "add" event calls.
to handle the scenario where you have a sorted list... you'll have to do some logic in your renderItem method to figure out the location of the item. something like this maybe (untested code... just an idea):
this code assumes you have an index attribute on your models to know the order that the models are supposed to be in.
also note that there's a high likelihood that this code won't execute as-is, since i haven't tested it out. but it should give you an idea of the code you'll want to write.
如果模型发生变化,您无需遍历集合。简单地为每个模型渲染一个子视图,您可以在其中处理
change
事件。想象一下您有以下结构:
和两个视图:
在任务视图的
#render
方法中,您渲染例如一个元素,它将保存您的任务(子意见)。然后,您迭代所有集合的模型,并为每个模型创建一个任务视图,传递模型并将其
el
附加到您的主视图中。
在任务视图中,您将
#render
方法绑定到模型change
事件,每个任务视图都会自行处理。 ——我说得有道理吗?You don't need to go through the collection if the model changes. Simple render a sub view for each model and in which you can handle the
change
event.Imagine you have the following structure:
And two views:
In the
#render
method of the Tasks view you render e.g. a<ul>
element which will hold your tasks (sub views). Then you iterate through all your collection's models and create a Task view for each, passing the model and appending it'sel
to your main views<ul>
.Within your Task view you bind the
#render
method to the modelschange
event and each Task view will take care of itself. — Am I making sense?