后台查找分类模块的分类列表怎么实现？求思路

Question

要实现这种效果的？应该怎么实现？求思路？前端应该怎么布局？数据应该怎么处理？

Answer 1

这个我以前做过。这个我想，有两种方案。第一种是 逐级加载，这种应该都会操作，结合ajax。第二种就是一次性加载，这种方式步骤：
1，查询所有的类目（类目的数据库要创建好，子类需要有一个parent_id字段，还需要第几级的字段，暂且叫level--深度）
2，找到level的最大值
3，通过3层的foreach循环，最外层的循环次数就是level的最大值，最里面的两层是核心，最里层的循环任务就是，把类目赋值到父类目的数组里面，比如：
array(
0=>array('一级类目','一级子类目')
1=>array('一级类目2','一级子类目')
}
一级子类目就是二级类目了（这个可以通过深度得知）,插入到新的数组之后，记得及时清理元素组中的当前数组。
注：里面两层，第一层是按顺序循环所有层级的类目，第二层就是负责把子类目放到父类目的数组里面。

最后生成的数组的结果是：

一级类目1
-------二级类目1
-------二级类目2
-------------三级类目1
-------------三级类目2
一级类目2
-------二级类目1
接下里，在前端页面里，循环，也是一层一层地，这个时候还是需要level 三层循环 按顺序 类目就出来了！！！

Answer 2

json数据结构
{
    data:[{// 一级菜单
            id:1,
            level:1,
            pid:0 // 父级id，因为是一级菜单，所以为0
            menu:[{ // 二级菜单
                id:2,
                level:2,
                pid:1, // 父级id，因为是二级菜单，所以为上一层菜单的id    
                menu:[{ // 三级菜单
                    id:4,
                    level:3,
                    pid:2 // 父级id，因为是三级菜单，所以为上一层菜单的id    
                }
            },{
                id:3,
                level:2,
                pid:1 // 父级id，因为是二级菜单，所以为上一层菜单的id    
            },...{}]
        },...,{}]
}

前端使用递归来遍历这个json数据:

function handleData(data,arr){
    var newArr = arr || [];
    data.forEach(function(item,index){
        newArr.push(item);
        if(item.menu){
            handleData(item.menu,newArr);
        }
    });
    return newArr;
}