Question

我有一系列页面状态，基本上模仿购物车结帐流程，如下所示：

var ItemsCollection = Backbone.Collection.extend({
    model: ItemModel,    
    url "/items" 
});

var ItemsView = Backbone.View.extend({
    // Select item on click event here
});

var ItemsApp = Backbone.View.extend({
    // Fetch collection of items and render each ItemsView

});

当选择一个项目时，我想基本上改变状态以呈现该项目的卖方。架构看起来像这样：

var SellersCollection = Backbone.Collection.extend({
    model: SellersModel,    
    url "/sellers" // The item ID is stored in a session NOT in the url (So permalinks work) 
});

var SellersView = Backbone.View.extend({
    // Select item on click event here
});

var SellersApp = Backbone.View.extend({
    // Fetch collection of sellers and render each SellersView

});

所以给定这两个状态，实例化卖家收藏的基础位置在哪里，获取卖家并渲染视图？

我在考虑将SellersApp视图和ItemsApp视图基本上组合成一个控制器，用于确定要呈现的子视图和要获取的集合。如果我这样做，我应该在主应用程序命名空间中实例化BOTH集合并在需要时获取集合，或者我应该仅在调用相应的状态（url）时实例化每个集合。我认为后一种方法违反了得墨忒耳法则。

我认为我应该这样做。

// 1. Instantiate outside the view
var MainApp  = Backbone.View.extend({

     attributes: {
         "page": "items"
     },

     items: function(){
        // Fetch items collection and render view (listenTo used in initialize)
     },

     sellers: function() {
          // Fetch sellers
     }

});

Items = new ItemsCollection;
Sellers = new SellersCollection;

这是一个好方法吗？如果这是一个好方法，我应该在哪里告诉MainApp更改状态 - 即我应该显式调用主应用程序的获取集合方法（即在ItemsView'click'事件中，显式声明ItemsApp.sellers）或者我应该在主应用程序视图上使用监听器来自动侦听要选择的项目。

我基本上正在寻找使用router.navigate的替代方法 - 触发并使用路由器实例化每个视图/集合，因为我听说这不是一个好习惯。

Answer 1

不幸的是，使用Backbone（尤其是Backbone Views）并不是一种“正确”的做事方式。没有参考惯例。很多使用Backbone的人只使用模型/集合，根本不使用视图。

在我看来，除非实际上做一些重要的事情，否则我会废弃一个集合视图。使用层次结构App＆gt; ModelCollection + ModelViewCollection。

所以在你的情况下：

ItemsApp (Backbone.View)
--ItemCollection (Backbone.Collection)
  --Item (Backbone.Model)
    -- SellerCollection (Backbone.Collection)
--ItemViewCollection (Array)
  --ItemView (Backbone.View)
    -- SellerViewCollection (Array)

因此，当ItemCollection发生更改时，您的ItemsApp将创建并销毁ItemViews（听取事件）。

ItemView负责知道用户何时根据事件选择它。然后，它可以选择在其模型上填充SellerCollection。未选中时，它可以清除该集合。它还会监听SellerCollection中的更改，并为每个卖家添加和删除视图。

我认为没有任何内置方法来存储Backbone.Views列表，您可能只想创建自己的数组。由您来跟踪视图，因为模型本身不应该引用它的视图。

值得让全局事件对象充当一种消息传递系统。 Backbone.View实现Backbone.Events，因此您可以全局声明您的app对象，然后监听任何事件。您应该只在需要时使用它，否则您应该直接监听事件而不是全局触发事件。例如，你的ItemView可能有一个“后退”按钮，它自己引发一个名为“后退”的事件，而你的AppView正在监听活动的ItemView上的事件，当它想要返回时，AppView将进行必要的更改到DOM并取消选择该项目。

如何正确使用Backbone视图和路由器

1 个答案: