[英]Removing view from DOM in backbone
我搜索并找到了一些如何从DOM中移除视图的线索,如Zombie RUN! 和其他人发布。 之后我选择其中一个来做这里的链接 。
这是我的观点:
var HomeView = Backbone.View.extend({
initialize: function() {
myCart1.updateQtyLabel("qtyCart");
window.localStorage.setItem("User",serializeObjToJSON(customer));
},
el: '#webbodycontainer',
events : {
"click #addToCart" : function(){
myCart1.addToCart(newItem);
myCart1.updateQtyLabel("qtyCart");
$("#containernewpromotion").html(promotionItem);
}
},
render : function(){
this.$el.html(homePanel);
$("#containernewpromotion").html(promotionItem);
},
remove: function() {
this.undelegateEvents();
this.$el.empty();
this.stopListening();
return this;
}
});
return HomeView;
这是我的路由器:
app_router.on('route:home', function( ){
var homeView = new HomeView();
homeView.remove();
homeView = new HomeView();
homeView.render();
});
但是视图仍然留在我的DOM中。 请关于这个问题的任何想法。 谢谢。
问题在这里:
app_router.on('route:home', function( ){
var homeView = new HomeView();
homeView.remove();
homeView = new HomeView();
homeView.render();
});
在第3行中,您正在调用remove()
方法。 在第4行,你再次实例化它,在第5行,你正在插入DOM。
你必须在render
后调用remove
。 但是,如果您立即调用remove,则可能在DOM中看不到任何内容。 下面是一个从DOM中删除元素的示例,单击它时
var HomeView = Backbone.View.extend({
.....
events : {
"click #addToCart" : function(){
myCart1.addToCart(newItem);
myCart1.updateQtyLabel("qtyCart");
$("#containernewpromotion").html(promotionItem);
},
'click': 'remove'
},
......
});
现在,您可以按如下方式呈现它:
app_router.on('route:home', function( ){
var homeView = new HomeView();
homeView.render();
});
您现在应该看到页面上的元素。 单击它们时,应将其删除。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.