美文网首页
递归常用方法

递归常用方法

作者: JackyLF | 来源:发表于2019-04-23 16:04 被阅读0次

    1、后端一次性返回所有树节点的数据,如何进行优雅的渲染呢?

    例如后端返回的是这样的数据: image.png

    这个时候我们就要根据pid === id来进行树结构的分类

        resetTree (val) {
          let list = val || []
          let result = []
          let hashTable = {}
          for (let i = 0; i < list.length; i++) {
            let label = list[i]
            let id = parseInt(label.id)
            let parentId = parseInt(label.pId)
    
            hashTable[id] = label
            label.children = []
    
            if (parentId === 0) {
              result.push(label)
            } else {
              let parent = hashTable[parentId]
              if (!parent) {
                console.log('这个label找不到父级', label.id)
              }
              parent && parent.children.push(label)
            }
            this.setTree(result)
          }
        }
      /*
        通过这个方法就可以把数据转变成正常的树形的结构数据
       这个时候还需对字段进行替换就需用到递归替换
     */
        setTree (val) {
          let item = []
          val.map((list, i) => {
            let newData = {}
            newData.label = list.resName
            newData.id = list.resId
            newData.pId = list.parentResId
            newData.is_show_add = false
            newData.is_show_del = false
            newData.children = list.subResList ? this.setTree(list.subResList) : []
            item.push(newData)
          })
          this.treeList = item
          return item
        }
       通过这个方法就可以把字段替换成 ui框架对应的渲染字段
       这个也是一个常见的递归方法
    

    相关文章

      网友评论

          本文标题:递归常用方法

          本文链接:https://www.haomeiwen.com/subject/ruovgqtx.html