Backbone.js 路线及；事件-backboneJS

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

以下是两种情况：

触发事件：

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;
    }
});

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;
    }
});

或者，我应该走这条路线：

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 () {
        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;
    }
});

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;
    }
});

我认为这是第一种情况-考虑到主干是事件驱动的，但第二种情况显然代码较少

另外，我认为第三种方案是在第一种方案中保留视图代码，但在第二种方案中获取路由器方案。。。在导航上呈现视图，但在我想在其他地方触发的情况下公开事件

---

想法？

我会使用第二种场景。没有看到使用第一种方法的任何好处。这样做更有意义（但仍有争议）：

---

这样，您至少可以在不更新url的情况下触发路由操作。但使用主干网、路由器、视图顺序（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);
}

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

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

是否有多个独立的逻辑工作将响应此事件

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

---

如果这两个都是“是”，那么事件应该是一个很好的匹配。如果两者都是“否”，那么直接的函数逻辑更适合。在“导航到此URL触发此视图”的情况下，通常这两个问题的答案都是“否”，因此，您可以将该逻辑编码到路由器的route handler方法中并使用它。

我认为您的全局事件与我们已有的路由器事件完全相同，增加了复杂性，但没有任何好处。我同意您的观点，Peter。在我看来，这段代码比Scott描述的第一种方法更有意义（特别是如果他在fetch success回调中没有事件触发器）。我一般会使用他的第二个场景。（仅供参考，今年剩下的时间我会继续讨论。还没有时间消费/测试&标记作为答案）我认为另一件事需要考虑的是“谁应该知道谁”。ie路由器应该知道视图，还是视图应该知道路由器（或者两者都不知道）？在这种情况下，我认为路由器应该知道视图，反之亦然，因为路由器就像一个“全局”对象，视图应该只管理与视图（可能还有子视图）关联的视图和模型视图必须知道路由器触发的事件，这是没有意义的。在场景2中，路由器知道视图，但视图不知道路由器是否正常（仅供参考。没有时间消费/测试&标记为答案）