深究JavaScript

接口响应父子结构的数据,前端重构数据结构为树形结构

2020-03-17  本文已影响0人  zhangweisep
/**
 * 组织数据(把后端传递过来的数组数据组合成符合树形菜单的数据结构)
 * @param data:后端数据
 * @returns {Array}:组织好的数据结构
 */
function toTreeData(data) {
    var pos = {};
    var tree = [];
    var i = 0;
    while (data.length != 0) {
        //判定是否是根节点
        if (data[i].pid == 0) {
            tree.push({
                level: data[i].level,
                pid: data[i].pid,
                id: data[i].id,
                title: data[i].title,
                items: []
            });
            pos[data[i].id] = [tree.length - 1];
            data.splice(i, 1);
            i--;
        } else {
            var posArr = pos[data[i].pid];
            if (posArr != undefined) {
                var obj = tree[posArr[0]];
                for (var j = 1; j < posArr.length; j++) {
                    obj = obj.items[posArr[j]];
                }
                obj.items.push({
                    level: data[i].level,
                    pid: data[i].pid,
                    id: data[i].id,
                    title: data[i].title,
                    items: []
                });
                pos[data[i].id] = posArr.concat([obj.items.length - 1]);
                data.splice(i, 1);
                i--;
            }
        }
        i++;
        if (i > data.length - 1) {
            i = 0;
        }
    };
    return tree;
}
上一篇 下一篇

猜你喜欢

热点阅读