【问题标题】:backbone routes - ordering and filtering主干路由 - 排序和过滤
【发布时间】:2012-02-23 20:58:35
【问题描述】:

在我的 Backbone 应用程序中,在我的集合中,我有许多排序方法,当基于集合呈现视图时,我当前使用通过路由设置的全局变量(我使用全局变量来执行此操作,因为其他操作添加到集合中我希望使用最后一个订单)。例如

routes : {
    "" : "index",           
    '/ordering/:order' : 'ordering'
},
ordering : function(theorder) {
    ordering = theorder;
    listView.render();  
},

那么在我看来

if (typeof ordering === 'undefined') {
    d = this.collection.ordered();          
} 
else if(ordering == 'owners') {
    d = this.collection.owners();
} 

_.each(d, function(model){          
    model.set({request : self.model.toJSON()});
    var view = new TB_BB.OfferItemView({model : model});
    els.push(view.render().el);
});

ordered 和 owner 是 2 种订购方式。

所以我的第一个问题是,有人可以根据路线建议一种更好的实施方式吗?此视图在多个位置呈现,因此我使用全局变量而不是将有序变量传递给方法?

第二个问题是 - 我还想添加一些过滤,所以假设我想按“价格”排序,但也进行一些过滤(比如说按多个类别 ID)。我如何添加灵活的“路线”来处理过滤。

我想我能做到

routes : {
    "" : "index",
    '/ordering/:order/:filter1/:filter2' : 'ordering'
},

所以 filter1 和 filter2 将是后续过滤,但如果过滤器可以是 0 或 100,这将不起作用。谁能提供解决方案?

【问题讨论】:

    标签: backbone.js routes


    【解决方案1】:

    首先,您应该使用 Backbone 的内置功能来自动排序集合。您可以通过在集合上定义 comparator 函数来利用这一点。这为您提供了开箱即用的各种胜利 - 例如,每次您添加或删除某些内容时,该集合都会根据您的 comparator 自行重新排序。如果要定义多个排序函数,只需将它们全部定义为函数,然后在需要时更新comparator。然后你就可以抛弃那个丑陋的全局var

    对于您的第二个问题,我不完全确定“如果过滤器可能是 0 或 100,这将不起作用”是什么意思。如果您的意思是如果您不指定 所有 过滤器就会遇到麻烦,那么这是真的。但是您可以使用通配符来解决这个问题。这可能是这样的:

    // your routes look like this:
    routes : {
        '/ordering/:order/filters/*filters' : 'ordering' // your routes will look like: /ordering/price/filters/filter_one/filter_two/filter_three
    },
    ordering: function (order, filters) {
      filters = filters.split('/'); // creates an array of filters: ['filter_one', 'filter_two', 'filter_three']
      listView.render(filters); // pass your filters to the view
    }
    
    // listView.render() looks like this:
    render: function(filters) {
      collection = this.collection;
      _.each(filters, function (filter) {
        collection = collection.filter(function () {
          // your actual filtering code based on what the filter is
        });
      });
    }
    

    【讨论】:

    • 非常感谢乔希,比较器似乎完全符合我的需要!过滤也是如此!
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2016-08-27
    • 2015-02-11
    • 1970-01-01
    • 2012-08-17
    • 1970-01-01
    相关资源
    最近更新 更多