重塑骨干的JS删除视图(Recreating a removed view in backbone

2019-06-25 09:53发布

在骨干JS的View.remove()函数将删除DOM从重现已经被去除的观点防止视图本身的容器元素。 任何想法,这种情况下如何处理

这里是我的代码,

var AttributeView = Backbone.View.extend({
        el: $("#attrs"),
        template:_.template($('#attrs-template').html()),

        initialize:function() {
        },


        render:function (eventName) {
            $(this.el).html(this.template(this.model.toJSON()));
            return this;
            },

        dispose:function(eventName){
            this.unbind();
            this.remove();
        },

    });


var attrView = new AttributeView();
....
attrView.dispose();
//Later on some event I do the below
attrView = new AttributeView()
attrView.render();

最后两行以上不重新创建视图与ID =“ATTRS”股利是不再存在。

Answer 1:

首先,你不需要你的dispose方法,标准的remove是足够了:

var attrView = new AttributeView();
//....
attrView.remove();  // <--------- Do this instead
//...
attrView = new AttributeView()
attrView.render();

其次,你可以覆盖remove如果标准版本没有你所需要的。 该默认实现简单地删除this.el并清理一些事件侦听器:

remove: function() {
  this.$el.remove();
  this.stopListening();
  return this;
},

在你的情况,你要撤消一切render确实,这意味着清理出里面的HTML this.el并通过调用移除事件undelegateEvents

remove: function() {
    this.undelegateEvents();
    this.$el.empty();
    this.stopListening();
    return this;
},

然后,你可以调用attrView.remove()并把它扼杀掉和(new AttributeView()).render()把它带回来。

演示: http://jsfiddle.net/ambiguous/Pu9a2/3/



Answer 2:

看看布局管理骨干意见,这明白,当你删除一个视图(父-安全壳的意义,而不是对象的层次感),其子视图也应该删除。



文章来源: Recreating a removed view in backbone js