Should/Can you use jQuery in a Vue2 app

#1

I have been asked to implement jQuery Validate into my Vue project but I have read in various places that you should not add jQuery into the mix because JS has an internal rep of all the DOM elements. That way the actual DOM doesn’t have to be analyzed every time a change is made but if you manipulate the DOM using JQuery then it no longer matches the virtual representation being used by Vue as Vue own’s the patch of DOM and if JQuery makes a change to an element that Vue is managing like adding a class (which the JQ Validate does - valid/error), Vue isn’t aware of the change and will overwrite

basically, my question is can/should I use this or use something like vuelidate? which is designed for Vue

#2

I imagine that you can get into problem if both Vue and another library tries to update the DOM. They will not be aware of each others changes to the DOM and could for example remove DOM elements the other one has added, etc. So the general answer is probably it’s a bad idea to mix libraries that make changes to the DOM.

But for smaller things you could probably get it to work. For example, if Vue doesn’t need to make changes to anything related to the form, then you could probably use jQuery to validate the form. However, it’s probably a bit more complicated to use it correct than what you are used to. For example, when the HTML elements jQuery uses have been removed, you need to remove jQuery from them, otherwise you are leaking memory.

#3

you can.
you should not use jQuery in a Vue2 app!