element icon indicating copy to clipboard operation
element copied to clipboard

el-tree增加虚拟滚动后,深度搜索结果树,在滚动中出现空白偏移。如果能在深度搜索中,匹配文字可以特殊标记就更好。

Open nanmu32 opened this issue 4 years ago • 4 comments

组件初始化正常,出如关键字查询,显示新的树,滚动树的滚动条,渐渐空白拉大。到底部几乎全部空白

nanmu32 avatar Mar 08 '21 06:03 nanmu32

element的tree是通过一个visible变量来控制树节点的显示的,可能是传入vue-virtual-scroll-list的data-sources数据和实际显示的节点不一致导致的显示错误, 可以尝试在tree.vue中的flattenTree方法中添加一个判断,过滤掉传入data-sources的数据

flattenTree(datas) {
  return datas.reduce((conn, data) => {
    if (data.visible) { // 添加一个判断
      conn.push(data); 
    }
    if (data.expanded && data.childNodes.length) {
      conn.push(...this.flattenTree(data.childNodes));
    }
    return conn;
  }, []);
 },

Victor-dreamer avatar Mar 12 '21 06:03 Victor-dreamer

过滤掉传入数据不现实 如果tree组件有勾选功能 数据过滤了怎么勾选 filter-node-method节点的样式是display:none 整体tree的padding计算时候没考虑style:none节点。

NoPersonal-git avatar Mar 25 '21 09:03 NoPersonal-git

element的tree是通过一个visible变量来控制树节点的显示的,可能是传入vue-virtual-scroll-list的data-sources数据和实际显示的节点不一致导致的显示错误, 可以尝试在tree.vue中的flattenTree方法中添加一个判断,过滤掉传入data-sources的数据

flattenTree(datas) {
  return datas.reduce((conn, data) => {
    if (data.visible) { // 添加一个判断
      conn.push(data); 
    }
    if (data.expanded && data.childNodes.length) {
      conn.push(...this.flattenTree(data.childNodes));
    }
    return conn;
  }, []);
 },

你的这种方法可以使用,他的数据存在node里面并没有破坏原始数据,还能及时更新虚拟滚动的列表

nanmu32 avatar Apr 02 '21 01:04 nanmu32

element的tree是通过一个visible变量来控制树节点的显示的,可能是传入vue-virtual-scroll-list的data-sources数据和实际显示的节点不一致导致的显示错误, 可以尝试在tree.vue中的flattenTree方法中添加一个判断,过滤掉传入data-sources的数据

flattenTree(datas) {
  return datas.reduce((conn, data) => {
    if (data.visible) { // 添加一个判断
      conn.push(data); 
    }
    if (data.expanded && data.childNodes.length) {
      conn.push(...this.flattenTree(data.childNodes));
    }
    return conn;
  }, []);
 },

你的这种方法可以使用,他的数据存在node里面并没有破坏原始数据,还能及时更新虚拟滚动的列表 能更新到你的git上吗这个方法

NoPersonal-git avatar Apr 20 '21 08:04 NoPersonal-git