Remove listener from element outside LV control

I have this UC where I need to add/remove my own elements in JS on top of a LiveView rendered template.
For this purpose I use phx-update=“ignore” in the container element to which I add my JS controlled element.
I also add a listener to that element (since I cannot use phx-hook with it). And, naturally, I remove the listener when removing the element manually.

However, I don’t know how to remove the listener from my manually added element when LV removes its parent container element. Up until v0.15.2 there was the beforeDestroy callback, but not any more.

Any ideas?

put a hook on the ignored container and do you cleanup on destroyed

1 Like

Thanks Chris, will try that. At first I wasn’t sure about that method because neither the container nor its children are in the DOM at the moment the :destroyed callback is invoked for the container.

Out of curiosity, why was beforeDestroy removed? I’m having trouble trying to integrate a Bootstrap modal. Making it appear is easy, but when it’s removed by LiveView, it’s just gone without the gentle hiding I would like (and could make happen with a beforeDestroy hook). I’m guessing there was some technical reason it was necessary but it’s missed.

1 Like