今天写了一个树形表格,遇到一个问题,只有第一行的数据无法进行展开与收起,其他行正常
1.问题描述
如图,只有位于第一行的item1无法展示与收起,item2正常。
2.解决方法
阅读ele文档,注意到这么一句话渲染树形数据时,必须要指定 row-key
,只有第一行异常,那是不是第一行的row-key不符合条件呢?
// 原来的row-key: 从0开始: 0,1,2,3...
resp.forEach(item => {
let name= item.name;
let index= resp.indexOf(item);
this.dataList.push({name: name,index:index})
})
// 修改后的row-key: 从1开始: 1,2,3...
resp.forEach(item => {
let name= item.name;
let index= resp.indexOf(item)+1;
this.dataList.push({name: name,index:index})
})
至此,问题解决。当row-key
从1开始以后,第一行也可以正常收起和展开了。
3. 尝试
尝试1: row-key 为负数:
resp.forEach(item => {
let name= item.name;
let index= resp.indexOf(item)-9999;
this.dataList.push({name: name,index:index})
})
所有列可以正常收起和展开。
尝试2: row-key 为String:
// // 修改后的row-key: 从A开始:"A","B"...
resp.forEach(item => {
let name= item.name;
let index= String.fromCharCode(resp.indexOf(item)+65);
this.dataList.push({name: name,index:index})
})
所有列可以正常收起和展开。
4. 结论
树形表格row-key
可以支持string,正负数,为row-key = 0
时会出现效果异常
晓看天色暮看云,行也思君,坐也思君;春观百花冬观雪,醒亦念卿,梦亦念卿