Vue judges class of dom

vue Click to add class to dom and then get the dom with class
< div class= "chose-ck" VMI for = "(item,index2) in colors": key= "index2" ref= "chosebox" >

                                    

{{item.name}}

<dt v-for="(item2,index) in item.childsCurGoods" :key="item2.id" :class="index==iac[index2]?"check":""" :id="item2.id" :data-chosename="item.name" :data-choseidname="item2.name" :data-chose="item.id" :data-id="item2.id" @click="chek(index2,index)" > {{item2.name}} </dt> </div>js chek(index2, index) { this.iac[index2] = index this.iac = this.iac.concat([]); this.checkchose() }, checkchose:function(){ var chose=this var chosedom=chose.$refs.chosebox console.log(chosedom) for (var i=0;i<chosedom.length;iPP) { var children=chosedom[i].children for (var j=0;j<children.length;jPP) { if(children[j].className=="check") { console.log(children[j]) } } } }

print the dom obtained after clicking

if(children[j].className=="check")
domdom

Mar.05,2021
One parameter of the event bound by

html, plus the first parameter of the event object $event,js method, is written as


write @ click= "fun (this)" in the place where the event is bound js `fun (e) {
consoloe.log (e.target.className) / / this e means you click the current button
} `


vue is reactive. Use vue to avoid operating dom, to bind data to dom, and modify dom, by modifying data. If you directly manipulate dom, you will completely abandon the greatest advantage.

Menu