javascript – 我可以将Marionette集合视图附加到现有HTML吗？

我正在使用带有node的browserify来渲染服务器上的集合,然后在客户端使用Marionette.

是否可以使用Marionette区域attachView()将CollectionView附加到现有的html列表？

解决方法:

Marionette没有提供通过标准API执行此操作的方法,但可以使用Marionette的一些内部CollectionView方法.我在这里提供了一个例子：

http://jsbin.com/zirupeli/1/edit

关键部分是CollectionView中的createChildren函数：

var List = Marionette.CollectionView.extend({
  el: 'ul',

  itemView: Item,

  initialize: function() {
    this.createChildren();
  },

  createChildren: function() {
    this.collection.each(function(model) {
      var view = new this.itemView({
        el: 'li:eq(' + (model.get('id') - 1) + ')',
        model: model
      });

      // set up the child view event forwarding
      this.addChildViewEventForwarding(view);

      // Store the child view itself so we can properly
      // remove and/or close it later
      this.children.add(view);
    }, this);
  }
});

这里我们只为集合中的每个项创建一个ItemView,然后调用两个内部Marionette CollectionView方法：this.addChildViewEventForwarding和this.children.add. Marionette在呈现子视图时会在内部使用它们：

https://github.com/marionettejs/backbone.marionette/blob/master/lib/backbone.marionette.js#L1687

只是为了证明这是正常工作的,四秒后您应该注意到一个项目被添加到列表中,并在八秒钟后删除列表中的第一个项目.

标签：javascript,collections,views,backbone-js,marionette
来源： https://codeday.me/bug/20190629/1323493.html