事情是这样的,小编的同事写出来一个bug,关于element radio组件双侧for循环的bug
原本要实现的是如下图的数据,首先数据第一层是优先级,第二层是radio,数据中所有的radio是一组,单选。
首先同事问我这个问题时,我首先想到的是element el-radio-group,但是问题来了,用双层v-for渲染的数据显示的结果如下
html:
<el-radio-group v-model="mm">
<div v-for="(item,index) in arr33" :key="index">
<p v-for="(data,k) in item.arr1" :key="k">
<el-radio :label="data.name">{{data.name}}</el-radio>
</p>
</div>
</el-radio-group>
data:
mm:'',
arr33:[
{
name:111,
arr1:{
name:111,
},
},
{
name:222,
arr1:{
name:222,
}
}
],
渲染结果:选中是所有数据同时选中(至今没有搞懂其中是为什么,element的坑,有知道的大神欢迎留言)
最后我们选择了原生的去解决了问题。