Backbonejs Marionettejs 僵尸视图答案

【问题标题】：Backbonejs Marionettejs zombie viewsBackbonejs Marionettejs 僵尸视图
【发布时间】：2014-10-20 08:46:05
【问题描述】：

我正在尝试使用木偶模块来玩 Backbone。

例如。实现“加载微调器”，正如 David Sulc 在“contact manager”应用程序中所做的那样，Firefox 的“backboneye”插件在“微调器”被内容替换后向我显示“僵尸视图”。它是“真正的”僵尸，因为它具有“isDestroyed:true”属性吗？

同样根据 Chrome 插件“Backbone debugger”，视图已被删除

我应该担心他们吗？

这里是控制器：

define(["app", "apps/items/itemsView"], function(app, View){
  app.module("ItemsApp.List", function(List, app, Backbone, Marionette, $, _){
    List.Controller = {
      listAllItems: function(){
        require(["common/views", "entities/items"], function(CommonViews){

          var loadingView = new CommonViews.Loading();
          app.main.show(loadingView);

          var fetchingItems = app.request("items:entities");
          var itemsPageLayout = new View.Layout();
          var panelView = new View.Panel(); 

         $.when(fetchingItems).done(function(items){
           var allItemsView = new View.Items({collection:items});   

           itemsPageLayout.on("show", function(){
              itemsPageLayout.panelRegion.show(panelView);
              itemsPageLayout.itemListRegion.show(allItemsView);
           });
         app.main.show(itemsPageLayout);
        });
      });
     }
   }
});
return app.ItemsApp.List.Controller;
});

【问题讨论】：

标签： javascript backbone.js marionette

【解决方案1】：

你可能没有僵尸视图。

如果您的 main 区域使用默认的 Marionette Region type 并且您的视图继承自 Marionette 视图类型（ItemView、CollectionView、CompositeView、Layout），则 Marionette 确保避免出现僵尸视图。

当视图被换出区域时（当您调用 app.main.show(itemsPageLayout) 时会发生这种情况），微调器视图元素会从 DOM 中移除，并且所有 listenTo 样式的事件处理程序都会解除绑定。

您可以在code for Region._destroyView 中看到这一点，它在show 上调用：

_destroyView: function() {
  var view = this.currentView;

  if (view.destroy && !view.isDestroyed) {
    view.destroy();
  } else if (view.remove) {
    view.remove();
  }
},

Marionette View 类型有一个 destroy 方法来处理删除 View 的 DOM 元素和解除绑定事件处理程序（与 listenTo 绑定 - 解除与 on 绑定的事件并不那么简单）。基于 vanilla Backbone.View 而不是 Marionette 类型的视图必须取消绑定它们自己的事件处理程序。未能正确执行此操作是僵尸视图的主要原因。通过使用 Marionette Views，您将受到保护。

如果您使用覆盖Region.show 的自定义Region 类型，您需要确保它在被换出的视图上调用destroy。

【讨论】：