Use the elements looped out by v-for in Vue to introduce jquery binding click event invalidation

introduce jquery, on another page to bind a click event to an element, using normal

on this page, the only difference for the same element is that this element needs to be looped out with v-for.
also introduces click events bound by jquery, will have no effect

I don"t know why

the two pages are basically the same, and there is no difference. The only difference is that the elements of this page are

looped out by v-for.

below is a screenshot of the code

Feb.11,2022

this is because the element is executed before the js is generated, and the newly generated element needs to be delegated to listen

$(document).on('click','.card-type-btn',function(){})

this has nothing to do with v-for. Jq uses on binding to add events for future dom

$('.card').on('click',function(){
    //...
})

because if you use it directly, you will unbind the existing dom, while v-for renders based on the data. There is no such dom on the page initially.


data is generated asynchronously, or the jquery method can be placed in the callback in which the data is returned successfully.

but why do you use jq?? @ click is not good?


v-for @click ...

Why do you use jQuery?

Menu