递归常用方法

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框架对应的渲染字段
   这个也是一个常见的递归方法

你可能感兴趣的:(递归常用方法)