不能在特定分割后插入内容.Backbone.js

Can't insert content after specific division. Backbone.js

本文关键字：Backbone js 插入 分割 不能      更新时间：2023-09-26

我得到的是:

ProductListView.js 

define(['jquery', 'underscore', 'backbone', 'views/ProductView', 'views/PaginatorView'], function($, _, Backbone, ProductView, PaginatorView) {
    var ProductListView = Backbone.View.extend({
        className: 'productsList',
        initialize: function() {
            this.render();
        },
        render: function() {
            // some initialization
            // that's for zurb grid                
            this.$el.addClass('twelve columns');
            for(var i = startPos; i < endPos; i++) {
                this.$el.append(new ProductView({ model: products[i] }).render().el);
            }
            this.$el.append(new PaginatorView({ model: this.model, page: this.options.page }).render().el);
            // this.$el.after(new PaginatorView({ model: this.model, page: this.options.page }).render().el);
            return this;
        }
    });
    return ProductListView;
});

似乎我不能在this.$el之后插入一些东西。

this.$el.after(new PaginatorView({ model: this.model, page: this.options.page }).render().el);

虽然可以将PaginatorView添加到(ProductListView)视图中，但似乎不可能在其外部插入一些东西。

你遇到过类似的事情吗?

this.$el.after将失败，因为当render()被调用时，this.$el尚未插入DOM(它只是一个悬空的div)。

Backbone鼓励您等到视图的HTML内容准备好后再插入。这样，浏览器只重绘一次窗口，性能会好得多。

根据经验，您应该只操作位于骨干视图中this.$el内部的内容。

如果view元素还没有添加到DOM ("disconnected")，调用after()不会改变元素和DOM。但是，它返回一个包含两个元素的集合，您可以将它们赋值给this.$el，以便稍后附加它们。然而，我很确定这不是一个好的做法，因为View只与一个元素纠缠在一起。

相关文章：