求助:一个关于递归格式化数据的问题

现需要一个树形菜单(需要根据数据情况,自动生成,没有上线,极端情况就是有很多级菜单),现用插件替代,需要如下数据格式

[
    {
        name: '菜单名1',
        children: [
            {
                name: '菜单名1-1',
                children: [
                    {
                        name: '菜单名1-1-1'
                    }
                ]
            }
        ]
    },
    {
        name: '菜单名2',
        children: [
            {
                name: '菜单2-2'
            }
        ]
    },
    {
        name: '菜单3'
    }
]

// 数据会通过children包含子菜单,有多少级子菜单,数据内部就会有多少个children的嵌套

现后台提供的数据格式如下所示

[
    {
        name: '菜单一',
        children: {
            'aaa':{
                name: 'aaa'
            },
            'bbb': {
                name: 'bbb',
                children: {
                    'ccc': {
                        name: 'ccc'
                    },
                    'ddd': {
                        name: 'ddd'
                    }
                }
            }
        }
    },
    {
        name: '菜单2',
        children: {
            'eee': {
                name: 'eee'
            }
        }
    },
    {
        name: '菜单3'
    }
]


// 后台给的数据,在children中并非数组,而是将子菜单的名字当作了json的key,然后对应一个json字段{name: '菜单的名字'}

自己写的半成品方法如下所示

var treeData = [];
function createdTreeData(data) {
  data.forEach(function (item) {
    function children(childrenData) {
      var childrenArr = []
      for (key in childrenData) {
        // 就是在这个for in 的递归中始终出现问题
      }
      return childrenArr
    }
    treeData.push({
      name: item.name,
      children: children(item.children)
    })
  })
}
// ps:请勿使用ES6语法,因为基于一个老项目增加一个新功能,并没有babel

在线等,谢谢啦

阅读 2.3k
3 个回答

emmmm...

function handleChildren(obj) {
  return Object.keys(obj).map(function(v) {
    var children = obj[v].children;
    if (children) obj[v].children = handleChildren(children);
    return obj[v];
  });
}
function createdTreeData(arr) {
  return arr.map(function(v) {
    var children = v.children;
    if (children) v.children = handleChildren(children);
    return v;
  });
}
createdTreeData(arr);
//原始菜单
var nemuData1 = [
    {
        name: '菜单一',
        children: {
            'aaa':{
                name: 'aaa'
            },
            'bbb': {
                name: 'bbb',
                children: {
                    'ccc': {
                        name: 'ccc'
                    },
                    'ddd': {
                        name: 'ddd'
                    }
                }
            }
        }
    },
    {
        name: '菜单2',
        children: {
            'eee': {
                name: 'eee'
            }
        }
    },
    {
        name: '菜单3'
    }
]
//整理后的菜单
var nemuData2 = []

//整理菜单的方法
function formatData(data, parent){
    if(parent){
        for(var key in data) {
            var obj2 = {
                name: data[key].name,
                children: []
            }
            if(data[key].children){
                formatData(data[key].children, obj2)
            }
            parent.children.push(obj2)
        }
    }else {
        data.forEach(function (item) {
            var obj1 = {
                name: item.name,
                children: []
            }
            if(item.children){
                formatData(item.children, obj1)
            }
            nemuData2.push(obj1)
        })
        
    }
}
formatData(nemuData1)
console.log(nemuData2)
var tree = [
    {
        name: '菜单一',
        children: {
            'aaa':{
                name: 'aaa'
            },
            'bbb': {
                name: 'bbb',
                children: {
                    'ccc': {
                        name: 'ccc'
                    },
                    'ddd': {
                        name: 'ddd'
                    }
                }
            }
        }
    },
    {
        name: '菜单2',
        children: {
            'eee': {
                name: 'eee'
            }
        }
    },
    {
        name: '菜单3'
    }
];
var makeTree = function(data) {
    if (data instanceof Array) return data.map(function(n) { return makeTree(n); });
    else if (typeof data === "object") {
        if ("name" in data) {
            var obj = { name: data.name };
            "children" in data && (obj.chilren = makeTree(data.children));
            return obj;
        } else return Object.keys(data).map(function(k) { return makeTree(data[k]); });
    }
};
console.log(makeTree(tree));
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
宣传栏