Marionette 2.0 ViewDestroyedError: cannot use a view that has already been destroyed
I recently updated to Marionette 2.0.3
I figured out what I was getting
ViewDestroyedError: A previously discovered view cannot be used .
After looking for this error, I realized that it was due to re-submission of my view.
Below is my current code:
View.ElementPanel = Marionette.ItemView.extend({
//shorten as example
triggers: {
'click .js-show': "element:show",
},
initialize: function() {
this.listenTo(this.model, 'change',this.render);
},
})
var elementsPanelView = new View.ElementsPanel({
collection: elements
});
activityView.elementsListPanel.show(elementsPanelView);
elementsPanelView.on("childview:element:show", function(args, element) {
LessonManager.trigger("element:show", activityView.elementPanel, activity, element);
});
I figured out that the view reference is destroyed when the model is re-rendered on an attribute change. So getting the playPanelView.on ("childview: element: ...) elements is not executed by the elementsPanelView is essentially destroyed when my model changes.
I figured out from this github post https://github.com/marionettejs/backbone.marionette/issues/1510 that I shouldn't have referenced the view around as this is considered bad code. However, this would mean that I would not be able to handle trigger events as I used the item reference viewPanelView.on ("childview: element: show" ...) to intercept the trigger event.
Any help on this?
source to share
I don't quite understand the issue with referencing the view from the code you provided, but I have a suggestion. If you revisit the view based on the model change, you can try to see if it is destroyed or not:
this.listenTo(this.model, 'change', function(){
console.log(this.isDestroyed);
if(this.isDestroyed) return;
this.render();
});
If this console log is always correct, you will be calling a render on the destroyed view which will give you this error. You might run into circumstances like this where something on the model can also destroy the parent's view through it.
One more thing worth mentioning ...
Your child event: The event will pass the child view as the first argument and the jQuery event object as the second.
source to share
var anotherView2 = new AnotherView();
mainRegion.show(anotherView2, {preventDestroy: true});
mainRegion.empty({preventDestroy: true});
https://www.w3cschool.cn/doc_marionette_3/marionette_3-marionette-region.html enter code here
source to share