Извлечение представления из DOM в основу

Question

Я искал и нашел некоторые подсказки о том, как удалить представление из DOM, например Zombie RUN! и других сообщений. После этого я выбрал один из них, чтобы сделать here the link.

Вот мое мнение:

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. Подумайте над этим вопросом. Благодарю.

Answer 1

Проблема здесь:

app_router.on('route:home', function(){ 
    var homeView = new HomeView(); 
    homeView.remove(); 
    homeView = new HomeView(); 
    homeView.render(); 
}); 

В строке # 3, вы вызываете remove() метод. В строке # 4 вы создаете экземпляр снова и в строке # 5, вы вставляете в DOM.

Вы должны позвонить remove после render. Однако, если вы сразу вызываете 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(); 
}); 

Теперь вы должны увидеть элементы на странице. Когда вы нажимаете на них, их следует удалить.