共计 834 个字符,预计需要花费 3 分钟才能阅读完成。
elementUI 表格懒加载数据更新不及时,或者须要手动增加数据或者批改数据问题
问题剖析
elementUI 表格懒加载数据更新不及时,或者须要手动增加数据或者批改数据问题,如图:
应用树形表格时,因为 elmenetUI 官网没有提供表格的最新数据对象获取办法,因而咱们无奈拿到最新数据,也无奈批改数据对象,然而 elementUI 有一个表格的 state 属性咱们能够间接操作它来达到目标
—》this.$refs.mulTable.store.states.lazyTreeNodeMap
, 这个对象是子节点的对象数组,其构造如下,725,示意父级的 row-key 为 725
表格的第一级数据是寄存在组件的 data 属性的
因而,如果要批改第一级的数据,就批改表格组件 data 属性即可,如果批改子节点,就应用 this.$set(this.$refs.mulTable.store.states.lazyTreeNodeMap, index, item);
来批改即可
局部代码展现
// 给表格增加一个一级的节点
this.treeTableOptions.data.push(item);
// 在表格插入一个子节点
for (let index = 0; index < list.length; index++) {
i = index;
if (Object.prototype.toString.call(list[index]) !== '[object Object]' && !list[index]) {console.log('找到地位', index);
this.$set(this.$refs.treeTable.$refs.mulTable.store.states.lazyTreeNodeMap, index, item);
return;
}
}
总结
数表格第一季目录只跟 data 数据对象无关,子节点数据只跟 this.$refs.mulTable.store.states.lazyTreeNodeMap
无关,区别好关系批改即可
正文完