背景:
经常使用$refs去获取组件实例,一般都是拿到实例对象,这次去取值的时候发现,拿到的竟然是个数组。
原因:
这是vue的特性,自动把v-for里面的ref展开成数组的形式,哪怕你的ref名字是唯一的!
我是通过循环接口的数据,生成各个省份的树,虽然我通过加id的形式,想要让树变成唯一,方便通过$refs调用,但是通过循环生成的树,调用的时候就是数组形式
<div class="flex-tree" v-for="item in fakeRegionData" :key="item[0].id">
<el-tree :data="item"
show-checkbox
node-key="id"
:ref="'tree'+item[0].id"
highlight-current
:props="{children: 'children',label: 'name'}"
:default-expanded-keys="expandedData"></el-tree>
</div>
//给树赋值
handleSetCheckedKeys(val) {
this.regionData.map(item => {
console.log(this.$refs['tree'+item.id])
this.$refs['tree'+item.id][0].setCheckedKeys(val)
})
},