Vue $refs cannot be joined dynamically and cannot get objects

Original address: http://www.php.cn/js-tutorial-410304.html

This article brings to you the content is about Vue $refs do not use splicing reasons and solutions, there is a certain reference value, the need for friends can refer to, I hope to help you.

 <li class  = " audio-item Media   " v-if  ="  item.type = = 3   " @click = " handleclearinterval (item.id)   " > <xm-audio:audiosrc="  item.content   ": Size="  item.size   ":  Ref  =  ' audio ' +index  "  ></xm-audio></li> 

Handleclearinterval (ID) {    _.each (this. $refs, (item,key) +=        {if  'audio'+index) {            Console.log (this. $refs);            Console.log (this. $refs. Audio[key])        }    )},

That would be an error.

In another way, remove the audio

Change to Console.log (this. $refs [key])
It still doesn't work.

That's what the official describes.

Change to the following form

<liclass="Audio-item Media"V-if="Item.type = = 3"@click ="handleclearinterval (item.id)"> <xm-audio:audiosrc="item.content": size="item.size" ref="Audio"></xm-audio></li>


Handleclearinterval (ID) {ConstAudiolist = This. Filterlistbytype ( This. Info.insthomeworkcontents,3) _.each (Audiolist, (Item,key)={    if(Item.id! =ID) {Console.log ( This. $refs) Console.log ( This. $refs. Audio[key]);  This. $refs. Audio[key].clearinterval ()})},

So I can get the DOM I want, and here I get the sub-components that loop out, and that's the reason for not using stitching in the Vue $refs and how to fix it.

Vue $refs cannot be joined dynamically, cannot get object (GO)