Question

这里有很多几乎相同的问题，但不是我想要的。我需要帮助创建自我更新会话列表，该列表从套接字接收新会话并将其放入会话视图中。收到会话时已经存在第一个问题。这是代码：

var SessionsCollection = Backbone.Collection.extend({
model: Session,

initialize: function() {
var self = this;
this.socket = Socket.connection;

this.socket.on('session update', function(session) {
  if (!self.some(function(sess, index) {
    if (sess.get('_id') === session._id) {
      //If same id, same session which leads to decision - delete or update
      if (session.users.length || session.agents.length) {
        //If there is someone on the other side, update it
        self.set(session);
      } else {
        //Else delete it
        self.trigger('else', self.models);
        self.shift(session);  
        console.log("Deleting section of session updates");
      }
      return true;
    }})) {
    self.push(session);
    self.trigger('push', self.models);
    console.log("Adding section of session updates", self);
  }
});
},

我得到三个控制台日志＆＃34;添加会话更新部分＆＃34;当我尝试添加会话时，所有具有不同的cid（集合ID）。有什么想法吗？

第二个问题是如何在不再渲染整个视图的情况下继续进行。我想将表添加到表中，我使用这样的代码：

var SessionListView = BaseView.extend({
 id: "session-list-view",
 template: require('./session_list_view.tpl'),

initialize: function(options) {
  this.collection.on('reset', this.render, this);
  this.collection.on('else', this.render, this);
  this.collection.on('push', this.render, this);
}

postRender: function() {
  var self = this;
  var itemEl = this.$('tbody');

 this.collection.each(function(session) {
   var item = new SessionListItemView({
     model: session,
   });
   itemEl.append(item.render().$el);
 });

  },
});

虽然最后一部分在这里：

var SessionListItemView = BaseView.extend({
  className: 'session-list-item',
  tagName: 'tr',
  template: require('./session_list_item_view.tpl'),
}

我之前见过的所有问题，尝试在旅途中添加一些东西，并且不会以这种方式真正接收会话。删除也是我试图实现而不渲染所有会话而只是从视图中删除正确的会话。

Answer 1

对于第一部分，我认为这是因为您的套接字接收了几个事件。

对于第二部分，我认为你的方法很安静，不要忘记在子视图中定义渲染功能及其模型。

通过定义渲染功能在实例化第一个视图时渲染父视图然后在“推”触发更新功能（你称之为postRender），它只会用它的新数据重新渲染子视图。

Backbone集合在更新时添加项目并在视图中显示它

1 个答案: