SoFunction
Updated on 2025-04-05

vue implements dynamic assignment of id, click event to obtain the id operation of the currently clicked element operation

:id binding:

The output id is a_0, a_1. . . . .

 <div v-for="(item,index) in list" :key="index" >
 <div : @click="b(index)">Hahaha</div>
 </div>

Then you can get the corresponding id in the vue instance

b(index){
    (index,1);
}

or

<div @click="open($event)" >Add <div>

open(a){
  ()//1
}

Supplementary knowledge:How to dynamically insert DOM nodes in Vue?

Problem description:

Excluding the insertion method of data. If there are two sets of data, each of which is an object, how should I insert it when I want to load the next object?

2017/09/14 Last night, I was sleeping and thought of a solution in a daze. It was actually very simple, but I didn’t think about it carefully before.

Solution:

1. This requirement was previously achieved by rendering first and then inserting through the artTemplate plug-in.

2. Vue is to render after data is changed

3. So since this is the case, manually assemble the two sets of data in the problem into an array and then insert them dynamically. Isn’t the problem solved?

process:If there are two arrays A and B, it needs to be rendered

C = [
{
‘A': [],
‘B': []
}
]

Assemble it into a C array, and then dynamically insert the C array after each time you get new data, and then loop the C array in the DOM structure, bingo!

The above article vue dynamically assigns id values. The id operation of clicking events to obtain the currently clicked element is all the content shared by the editor. I hope it can give you a reference and I hope you can support me more.