数组转树,树转数组攻略大全

数组转树,树转数组攻略大全

  let list = [  //数据结构
        {
            pid: null,
            id: 1,
            serialNumber: '1',
        },
        {
            pid: 1,
            id: 11,
            serialNumber: '1',
        },
        {
            pid: 11,
            id: 111,
            serialNumber: '1',
        },
        {
            pid: null,
            id: 2,
            serialNumber: '1',
        },
        {
            pid: 2,
            id: 22,
            serialNumber: '1',
        },
        {
            pid: 22,
            id: 222,
            serialNumber: '1',
        },
    ]
  const defaultSetting = {  //配置项
        isParent: 'isParent',
        childrenKey: 'children',
        nameKey: 'name',
        titleKey: 'title',
        idKey: 'id',
        pIdKey: 'pid',
        levelKey: 'level',
        rootPId: null
    }

首先进行数组转树

 function transformToTreeFormat(data, setting = {}) {
        const sNodes = JSON.parse(JSON.stringify(data)) //克隆一份数据
        setting = defaultSetting
        const idKey = setting.idKey
        const pIdKey = setting.pIdKey //设置找到的父元素key
        const childrenKey = setting.childrenKey //父元素里子元素key名

        let i, j, l
        if (!idKey || idKey === '' || !sNodes) {
            return []
        }
        if (sNodes instanceof Array) {
            const r = []
            const tmpMap = []
            for (i = 0, l = sNodes.length; i < l; i++) {
                tmpMap[sNodes[i][idKey]] = sNodes[i]
            }

            for (j = 0, l = sNodes.length; j < l; j++) {
                if (tmpMap[sNodes[j][pIdKey]] && sNodes[j][idKey] !== sNodes[j][pIdKey]) {
                    if (!tmpMap[sNodes[j][pIdKey]][childrenKey]) {
                        tmpMap[sNodes[j][pIdKey]][childrenKey] = []
                    }
                    tmpMap[sNodes[j][pIdKey]][childrenKey].push(sNodes[j])
                } else {
                    r.push(sNodes[j])
                }
            }
            return r
        } else {
            return [sNodes]
        }
    }
console.log(transformToTreeFormat(list)) //

打印的结果

然后进行树转数组

 function transformToArrayFormat(data, setting = {}) {
        if (!data) return []

        function _do(_node) {
            r.push(_node)

            const children = nodeChildren(_node, setting)
            if (children) {
                r = r.concat(transformToArrayFormat(children, setting))
            }
        }

        const nodes = JSON.parse(JSON.stringify(data))
        setting = defaultSetting
        let r = []
        if (nodes instanceof Array) {
            for (let i = 0, l = nodes.length; i < l; i++) {
                const node = nodes[i]
                _do(node)
            }
        } else {
            _do(nodes)
        }
        return r
    }

    function nodeChildren(node, setting, newChildren) {
        if (!node) {
            return null
        }
        const key = setting.childrenKey
        if (typeof newChildren !== 'undefined') {
            node[key] = newChildren
        }
        return node[key]
    }

    let arrlist = transformToArrayFormat(treelist)
    console.log(arrlist)

    function setName(data) {
        for (var i in data) {
            if (data[i].children) {
                delete data[i].children
            }
        }
    }
    setName(arrlist)