JS使用递归将数组对象转为树结构（通常用于下拉框）

一、想要的效果

1. 数组对象

2. 转为树结构

二、代码示例描述

JS使用递归将数组对象转为树结构（通常用于下拉框）

1. 循环数组
2. 每一项的parent等于父节点的id
3. 把循环出来的父节点放到list这个空数组中
4. 到这一步就完成了树结构的父节点
5. 循环list,list是父节点的数组
6. 给list增加一个children属性是个数组
7. 通过调用函数自身传rootList,子节点的id和存子节点的数组
8. 处理当children为空的时候的判断条件
9. 当children为空的时候 删除这个子节点的children数组
10. getTreeList(rootList, null, []) 此处三个参数，第一个是数组rooList 第二个是 父级id:null，第三个参数是一个空数组[]
11. res是最后可以得到的树结构结果

<script>
        const rootList = [
            { id: 1, parent: null, text: '菜单1'},
            { id:11, parent: 1, text: '菜单1-1'},
            { id:12, parent: 1, text: '菜单1-2'},
            { id:2, parent: null, text: '菜单2'},
            { id:21, parent: 2, text: '菜单2-1'}
        ]
        function getTreeList(rootList, id, list){
            // 循环数组
            for (let item of rootList){
                if(item.parent == id){ // 每一项的parent等于父节点的id
                    // 把循环出来的父节点放到list这个空数组中
                    list.push(item) // 到这一步就完成了树结构的父节点
                }
            }
            for (let i of list){// 循环list,list是父节点的数组
                i.children = [] // 给list增加一个children属性是个数组
                getTreeList(rootList, i.id, i.children) // 通过调用函数自身传rootList,子节点的id和存子节点的数组 
                if(i.children.length == 0){ // 处理当children为空的时候的判断条件
                    delete i.children // 当children为空的时候 删除这个子节点的children数组
                }
            }
            return list
        }
        // 此处三个参数，第一个是数组rooList 第二个是父级id:null，第三个参数是一个空数组[]
        const res = getTreeList(rootList, null, [])
        console.log('res', res)
    </script>