backbone.js - 路由和事件——backboneJS

Question

我应该如何处理 BackboneJS 中的路由？路由时，在新建 View 后，我应该触发事件还是直接渲染 View ？

以下是两种情况:

触发事件:

routes: {
    'orders/view/:orderId' : 'viewOrder'
},
viewOrder: function (orderId) {
    var viewOrderView = new ViewOrderView();
    vent.trigger('order:show', orderId);
}

在我看来，我有:

var ViewOrderView = Backbone.View.extend({
    el: "#page",
    initialize: function () {
        vent.on('order:show', this.show, this);
    },
    show: function (id) {
        this.id = id;
        this.render();
    },
    render: function () {
        var template = viewOrderTemplate({ id: this.id });
        this.$el.html(template);
        return this;
    }
});

或者，我应该走这条路:

routes: {
    'orders/view/:orderId' : 'viewOrder'
},
viewOrder: function (orderId) {
    var viewOrderView = new ViewOrderView({id : orderId });
    viewOrderView.render();
}

在我看来，我有:

var ViewOrderView = Backbone.View.extend({
    el: "#page",
    initialize: function () {
        //init code here
    },
    render: function () {
        var template = viewOrderTemplate({ id : this.id});
        this.$el.html(template);
        return this;
    }
});

我 想 这是第一个场景——考虑到主干是事件驱动的，但第二个显然有更少的代码。

另外，我想第三种情况是将 View 代码保留在第一种情况中，但捕获第二种情况的路由器情况......在导航上渲染 View ，但如果我想在其他地方触发它，则公开一个事件。

想法？

Answer 1

因此，所有主干问题通常都会以许多似是而非的答案告终。在这种情况下，我相信您的第二个示例是更规范/典型的主干模式。撇开处理加载微调器和数据加载后更新的棘手问题不谈，路由器中简化的基本模式将是:

routes: {
    'orders/view/:orderId' : 'viewOrder'
},

viewOrder: function (orderId) {
    //Use models to represent your data
    var orderModel = new Order({id: orderId});
    //models know how to fetch data for themselves given an ID
    orderModel.fetch();
    //Views should take model instances, not scalar model IDs
    var orderView = new OrderView({model: orderModel});
    orderView.render();
    //Exactly how you display the view in the DOM is up to you
    //document.body might be $('#main-container') or whatever
    $(document.body).html(orderView.el);
}

我认为这是教科书的模式。同样，谁触发数据的获取并在数据到达后重新呈现的问题是棘手的。我认为最好是 View 知道如何呈现自身的“加载”版本，直到模型获取数据，然后当模型在获取完成后触发更改事件时， View 会使用加载的模型数据重新呈现自身。但是，有些人可能会将这种逻辑放在别处。 This article on building the next soundcloud我认为代表了许多非常好的“最先进”主干模式，包括它们如何处理未获取的模型。

通常，您可以根据自己的喜好使用回调或事件编写代码。但是，一个好的经验法则是问自己一些问题:

是否有不止一个独立的逻辑工作将响应此事件？

我是否需要将此事件的来源与响应它发生的事情分离？

如果这两个都是"is"，那么事件应该很合适。如果两者都是“否”，那么简单的函数逻辑更合适。在“导航到此 URL 触发此 View ”的情况下，通常这两个问题的答案都是“否”，因此您可以将该逻辑编码到路由器的路由处理程序方法中并完成它。