I realize my question may be a little bit broad, and the reasoning behind that is I don’t fully understand exactly what is happening, and why it is causing a problem.
I have an app that has some Vue components, as well as some jQuery mixed in (I know I know… This was not my doing, it was an inherited Shopify app).
The Vue application has a @Click event responsible for opening up a modal on the main screen, and this works fine. That is until another click handler prepends some HTML to the body via jQuery (this is straight from the Shopify theme). After the jQuery method runs which prepends the HTML to the body, the Vue click handler no longer works.
One strange thing about this is that the @Click handler is actually visible in the inspector panel after the jQuery DOM manipulation, so for some reason it is not being recognized for what it is, and instead just as an HTML element.
Does anyone know why this occurs, and how to get around it? I know mixing jQuery and Vue is generally bad, but there is currently no way around that mess right now. Any help would be greatly appreciated.