关键点
1. 使用 :ref="`record${i}`" （或者 :ref="'record'+i"），为每一项动态添加 ref;
2. 使用 this.$refs[`record${i}`] 获取当前元素 dom 结构
完整代码
<template>
<div class="wrap">
<div v-for="(item,i) in testArr" :key="item.id" :ref="`record${i}`" :id="'record'+i"
@click="changeStyle(i)">
{{item.name}}
</div>
</div>
</template>
<script>
export default {
data() {
return {
testArr:[
{
id:'1',
name:'张三',
},{
id:'2',
name:'李四',
},{
id:'3',
name:'王五',
}
]
}
},
methods: {
changeStyle(i){
this.$refs[`record${i}`][0].style.color = 'red';
}
},
mounted(){
document.getElementById('record2').style.color = 'green';
}
}
</script>
DOM 结构
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。
文章由极客之音整理，本文链接：https://www.bmabk.com/index.php/post/141341.html
