在视图之间移动时，Backbone会丢失下拉事件

Question

我有一个定义了几个这样的事件的视图：

events: {
    'click .js-icon-remove': 'removeFilter',
    'change .select-control': 'updateFilters',
    'click #btn_search': 'requestSearch',
    'click #btn_add_search': 'requestSaveSearch'
}

当更改事件在下拉列表中时，三个单击事件位于按钮或链接上。视图首次渲染时，所有事件都可以正常工作。但是，当我转到另一个页面然后返回到此视图时，下拉事件将丢失。如果我重新加载浏览器，事情再次正常。他们甚至可以多次工作，而不仅仅是第一次。就在我重新渲染视图时，事件绑定丢失了。

我尝试将事件从更改更改为单击，或者从类更改为元素（选择而不是.select-control）。所有的东西都会在第一次呈现视图时起作用，就是这样。

Answer 1

这是了解事件绑定在Backbone和DOM中的工作原理。

当视图呈现时，它的$ el被添加到DOM中，骨干自动绑定事件。但是，一旦从dom中删除了视图的$ el，那么当$ el被添加回dom时，这些事件将需要重新绑定。这就是你的delegateEvents（）方法正在做的事情。

在骨干中工作时的最佳做法是使视图是一次性的，例如在从DOM中移除后不要将它们保持在周围。当您离开视图并从dom中删除它，然后向后导航时，您应该重新实例化视图，渲染它，然后再次将其添加到dom中。您可以随身携带模型和集合，因此您没有重新获取数据，但是当视图保留在dom中或每次添加/删除时都会重新创建视图时，视图效果会更好。

我强烈推荐Marionette.js，特别是它的地区级别。在视图处理方面，它为您节省了大量的样板代码。