javascript - 在骨干路由器的一个动作中绑定多个视图

Question

我在骨干路由器中创建了一项操作：

 routes: {
    "showCart": "cartList",
 }
 .....
 app_router.on('route:cartList', function (showCart) {
    var cartListView = new CartList();
    cartListView.render();
 });

然后我有两个或两个以上的视图要在该操作中呈现。

var SignInView = Backbone.View.extend({
    el : $("#rightpanel"),
    initialize:function(){
        this.render();
    },
    render:function(){
        var template = _.template(signinTemplate, {})
        this.$el.html(template);
    }
});
return SignInView;

var CartListView = Backbone.View.extend({
    el : $("#cartlist"),
    initialize:function(){
        this.render();
    },
    render: function(){
        var item = deserializeJSONToObj(window.localStorage.getItem("Cart"));
        var str = '<table>';
        $.each(item, function(i, item) {
            str += '<tr><td><img src="' + item.PictureName + '" alt="Product" width="135px"/></td><td>'+item.Name+'</td></tr>';
        });
        str += '</table>';
        this.$el.html(str);
    }
});
return CartListView;

如何在路由器的一个操作中绑定这两个视图？

任何帮助，将不胜感激。

Answer 1

添加对路由器的更改

 routes: {
    "showCart": "cartList",
 }
 .....
 app_router.on('route:cartList', function (showCart) {
    var workView = new WorkView();
    workView.render();
 });

并创建名为 WorkView 的视图。

var WorkView= Backbone.View.extend({

    initialize:function(){

    },
    render:function(){
        var signInView = new SignInView ();
        var cartListView = new CartList();
    }
});