Question

我有一个backbone.js应用程序，我有一个视图：

var StoreView = Backbone.View.extend({
el: ".container",
initialize: function() {
    this.render();
},

events: {
    "click #addProduct": "addProduct",
},

render: function() {
    this.$el.html(render("index"));
},

addProduct: function(){
    var productView = new StoreProductView({
        el: $('#products')
    });
    productView.render();
}
});

和我的StoreProductView看起来像：

var StoreProductView = Backbone.View.extend({
render: function () {

    this.$el.html(render("products/product"));

    return this;
}
});

因此，当我点击#addProduct时，会调用一个新的StoreProductView模板。但如果再次点击#addProduct，则没有任何反应。我怎样才能获得它，以便每次#addProduct被命中时，会呈现一个新的StoreProductView？所以如果我多次点击x次，那就有x StoreProductView s？

Answer 1

您需要更改此行：

this.$el.html(render("products/product"));

以此为例：

this.$el.append(render("products/product"));

因为每次你替换html和nw你没有追加，只删除html内容并插入新内容。使用append()，您可以添加anoter产品。

骨干渲染视图多次

1 个答案: