2023年7月7日发(作者：)

js实现树级递归，通过js⽣成tree树形菜单（递归算法）⽅法封装：/** * 数据转换为树形（递归），⽰例：toTreeByRecursion(source, 'id', 'parentId', null, 'children') * @param {Array} source 数据 * @param {String} idField 标识字段名称 * @param {String} parentIdField ⽗标识字段名称 * @param {Any} parentIdNoneValue ⽗级标识空值 * @param {String} childrenField ⼦节点字段名称 * @param {Object} treeOption tree树形配置 */function toTreeByRecursion ( source = [], idField = 'id', parentIdField = 'parentId', parentIdNoneValue = '', childrenField = 'children', treeOption = undefined) { const treeOptions = { enable: false, // 是否开启转tree插件数据 keyField: 'key', // 标识字段名称，默认为key valueField: 'value', // 值字段名称，默认为value titleField: 'title', // 标题字段名称，默认为title keyFieldBind: 'id', // 标识字段绑定字段名称，默认为id valueFieldBind: 'id', // 值字段名称绑定字段名称，默认为id titleFieldBind: 'name' // 标题字段名称绑定字段名称，默认为name } // 合并tree树形配置 if (treeOption) { (treeOptions, treeOption) } // 对源数据深度克隆 const cloneData = (ify(source)) return (parent => { // 返回每⼀项的⼦级数组 const branchArr = (child => parent[idField] === child[parentIdField]) // 绑定tree树形配置 if () { (child => { child[ld] = child[ldBind] child[ield] = child[ieldBind] child[ield] = child[ieldBind] return child }) } // 如果存在⼦级，则给⽗级添加⼀个children属性，并赋值，否则赋值为空数组 if ( > 0) { parent[childrenField] = branchArr } else { parent[childrenField] = [] } // 绑定tree树形配置 if () { parent[ld] = parent[ldBind] parent[ield] = parent[ieldBind] parent[ield] = parent[ieldBind] } return parent[parentIdField] === parentIdNoneValue // 返回第⼀层 })}

使⽤⽰例：var jsonData = [ { id: '1', name: '1', parentId: null, rank: 1 }, { id: '2', name: '1-1', parentId: '1', rank: 1 }, { id: '3', name: '1-2', parentId: '1', rank: 1 }, { id: '4', name: '2', parentId: null, rank: 1 }, { id: '5', name: '2-1', parentId: '4', rank: 1 }, { id: '6', name: '2-2', parentId: '4', rank: 1 }, { id: '7', name: '2-2-1', parentId: '6', rank: 1 }]const treeOption = { enable: false, // 是否开启转tree插件数据 keyField: 'key', // 标识字段名称 valueField: 'value', // 值字段名称 titleField: 'title', // 标题字段名称 keyFieldBind: 'id', // 标识字段绑定字段名称 valueFieldBind: 'id', // 值字段名称绑定字段名称 titleFieldBind: 'name' // 标题字段名称绑定字段名称}const treeData = toTreeByRecursion(jsonData, 'id', 'parentId', null, 'children', treeOption)(treeData)

说明：parentIdNoneValue ⽗级标识空值这个参数如果跟你数据⽆⽗级时的值不⼀致时，就配置这个参数。⽐如：这⾥默认值为null，你根节点parentId的值为-1或''。treeOption 参数可以不传，如果要绑定tree树形控件（⼀般都会有key、value、title这三个字段），那就需要配置这个参数，如果参数默认的配置跟你的不⼀样，那就通过参数覆盖的⽅式重新定义。treeOption 的三个绑定字段是指绑定你数据中的字段，实质就是把原数据字段绑定的tree树形控件需要的三个字段key、value、title。想到了再补充。。。