• el-tree 获取过滤后的树结构


    正常来说element框架应该返回的,但实际上没有,只能自己处理了

    递归处理,思路就是赋值,如果是自己过滤到的数据就push进去,不是就不要

    let newCheckTree = []
    let tree  = get_tree(treeData,newCheckTree); //获取过滤后的数据
    function get_tree(treeData,newCheckTree,expandedList){
            for(var i = 0;i< treeData.length;i++){
              if(treeData[i].child.length){
                newCheckTree[i] = {...treeData[i]}  //把所有的值赋上,但是child要为空,不然就一模一样了
                newCheckTree[i].child = []
                newCheckTree[i].child = findChildren(treeData[i].child,newCheckTree[i].child) 
              }else{
                let val = treeData[i].jGMC.toUpperCase()
                if(val.indexOf(filterText) !== -1){
                  newCheckTree.push(treeData[i])
                  // console.log(expandedList,'that.expandedList')
                  if(expandedList.indexOf(treeData[i].sid) == -1){
                    expandedList.push(treeData[i].sid)
                  }
                }
               
              }
            }
            return newCheckTree
          }
          function findChildren(treeData,newCheckTree){
            for(var i = 0;i< treeData.length;i++){
              if(treeData[i].child.length){
                newCheckTree[i] = {...treeData[i]}
                newCheckTree[i].child = []
                newCheckTree[i].child = findChildren(treeData[i].child,newCheckTree[i].child) 
              }
              let val = treeData[i].jGMC.toUpperCase()
              if(val.indexOf(filterText) !== -1){
                newCheckTree.push(treeData[i])
                // console.log(expandedList,'that.expandedList')
                if(expandedList.indexOf(treeData[i].sid) == -1){
                  expandedList.push(treeData[i].sid)
                }
              }
            }
            return newCheckTree
          }
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40

    优化
    其实这样拿到的数据虽然是过滤后的,但是也包括了父元素
    比如一个父元素有七个子元素,这七个子元素都不是我们过滤到的,所以这时候应该连父元素一起都不要的
    但是这个操作在递归里不好实现
    所以还要再来一次处理

    let newCheckTree  = get_tree1(JSON.parse(JSON.stringify(tree))); //删掉过滤后没有子元素的数据,深拷贝不然会被影响
    function get_tree1(treeData){
            for(var i = 0;i< treeData.length;i++){
              if(treeData[i]){
                if(treeData[i].child.length){
                  
                  treeData[i].child = findChildren1(treeData[i].child)  
                }else{
                //如果没有子数据就删掉它
                  treeData.splice(i,1)
                  i--
                }
              }
            }
            return treeData
          }
          function findChildren1(treeData){
            for(var i = 0;i< treeData.length;i++){
              // console.log(treeData,'treeData')
              if(treeData[i]){
                if(treeData[i].child.length){
                 
                }else{
                  treeData.splice(i,1)
                  i--
                }
               
              }
              
            }
            return treeData
          }
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
  • 相关阅读:
    PHP 图像处理组件:Intervention/image
    无人机矿业地形图测量方案
    尚硅谷MySQL学习笔记
    ElasticSearch7.3学习(十四)----生产环境实时重建索引
    使用设计模式基于easypoi优雅的设计通用excel导入功能
    反射机制了解
    MySQL高级SQL语句(二)
    HarmonyOS开发:【基于命令行(开发环境)】
    记录一次K8s pod被杀的排查过程
    基于PHP+MySQL学生创新作品展示系统的设计与实现
  • 原文地址:https://blog.csdn.net/qq_42795670/article/details/133913273