0

我有一系列页面状态,它们基本上模仿了购物车结帐过程,如下所示:

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 视图组合成一个控制器,作为一种控制器来确定要呈现哪个子视图以及要获取哪个集合。如果我这样做,我应该在主应用程序命名空间中实例化两个集合并在需要时获取集合,还是应该仅在调用相应的状态(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 更改状态 - 即我应该显式调用主应用程序的 fetch 集合方法(即
在 ItemsView 'click' 事件中,显式声明 ItemsApp.sellers)还是应该使用监听器在自动侦听要选择的项目的主应用程序视图上。

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

4

1 回答 1

1

不幸的是,对于 Backbone(尤其是 Backbone Views),并没有真正“正确”的方式来做事。没有参考约定。许多使用 Backbone 的人只使用模型/集合,根本不使用视图。

在我看来,除非它实际上在做一些重要的事情,否则我会放弃对收藏的看法。使用层次结构 App > ModelCollection+ModelViewCollection。

所以在你的情况下:

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

因此,您的 ItemsApp 将在 ItemCollection 更改时创建和销毁 ItemViews(监听事件)。

ItemView 负责根据事件了解用户何时选择它。然后,它可以选择在其模型被选中时填充 SellerCollection。取消选择时,它可以清除该集合。它还监听 SellerCollection 中的变化,并为每个卖家添加和删除视图。

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

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

于 2013-08-16T16:53:21.027 回答