如何使用更多链接按钮创建主视图？

Question

我正在尝试创建一个包含更多按钮的主视图。 请检查下图

这些按钮是从不同的响应生成的，对于每个按钮都会有一个响应，因此动态地创建按钮视图并将其附加。

如果有更多按钮（4,5等），则需要显示“更多”按钮，因此，如果用户单击“更多”按钮，则需要展开并显示所有按钮。

我们如何处理这种情况？ 我已经尝试过收集骨干

Answer 1

我想你可以做这样的事情？

http://jsfiddle.net/u9y574y8/

ExpandableView = Backbone.View.extend({
    itemTemplate: _.template('<button name="<%=name%>" id="<%=name%>" value="<%=name%>"><%=name%></button>'),
    id: 'expand',
    events: {
        'click #more': 'more'
    },
    initialize: function(opt) {
        // attach to the main body
        $(opt['main']).append(this.el)

        this.counter = 3;
        this.render();
    },
    more: function() {
        this.counter += 3;
        this.render();
    },
    render: function() {
        $(this.el).html('');
        for (var i = 0; i < this.counter; i++) {
            $(this.el).append(this.itemTemplate({name: i}));
        }
        $(this.el).append(this.itemTemplate({name: 'more'}));

        return this;
    }
});

var search_view = new ExpandableView({ main: $('body') });