博客

const list = [
  {id: 1, name: '中国', value: 10, pid: ''},
  {id: 2, name: '北京', value: 9, pid: 1},
  {id: 3, name: '上海', value: 8, pid: 1},
  {id: 4, name: '陕西', value: 7, pid: 1},
  {id: 5, name: '河北', value: 6, pid: 1},
  {id: 6, name: '青海', value: 5, pid: 1},
  {id: 7, name: '朝阳区', value: 4, pid: 2},
  {id: 8, name: '顺义区', value: 4, pid: 2},
  {id: 9, name: '怀柔区', value: 4, pid: 2},
  {id: 10, name: '西安市', value: 4, pid: 4},
  {id: 11, name: '延安市', value: 4, pid: 4},
  {id: 12, name: '咸阳市', value: 3, pid: 4},
  {id: 12, name: '西宁市', value: 2, pid: 6},
]

getToTree (pid, dataList) {
  let _this = this
  if(!pid) {
      return dataList.filter(item => !item.pid).map(item => {
        item.children = _this.getToTree(item.id, dataList)
        return item
      })
  } else {
      return dataList.filter(item => item.pid === pid).map(item => {
        item.children = _this.getToTree(item.id, dataList)
        return item
      })
  }
}

getToTree('', list)

// 返回结果
[
  {
      "id": 1,
      "name": "中国",
      "value": 10,
      "pid": "",
      "children": [
          {
              "id": 2,
              "name": "北京",
              "value": 9,
              "pid": 1,
              "children": [
                  {
                      "id": 7,
                      "name": "朝阳区",
                      "value": 4,
                      "pid": 2,
                      "children": []
                  },
                  {
                      "id": 8,
                      "name": "顺义区",
                      "value": 4,
                      "pid": 2,
                      "children": []
                  },
                  {
                      "id": 9,
                      "name": "怀柔区",
                      "value": 4,
                      "pid": 2,
                      "children": []
                  }
              ]
          },
          {
              "id": 3,
              "name": "上海",
              "value": 8,
              "pid": 1,
              "children": []
          },
          {
              "id": 4,
              "name": "陕西",
              "value": 7,
              "pid": 1,
              "children": [
                  {
                      "id": 10,
                      "name": "西安市",
                      "value": 4,
                      "pid": 4,
                      "children": []
                  },
                  {
                      "id": 11,
                      "name": "延安市",
                      "value": 4,
                      "pid": 4,
                      "children": []
                  },
                  {
                      "id": 12,
                      "name": "咸阳市",
                      "value": 3,
                      "pid": 4,
                      "children": []
                  }
              ]
          },
          {
              "id": 5,
              "name": "河北",
              "value": 6,
              "pid": 1,
              "children": []
          },
          {
              "id": 6,
              "name": "青海",
              "value": 5,
              "pid": 1,
              "children": [
                  {
                      "id": 12,
                      "name": "西宁市",
                      "value": 2,
                      "pid": 6,
                      "children": []
                  }
              ]
          }
      ]
  }
]

递归函数，根据父ID将数组转为JSON关系树