树形结构开发]菜单维护
文章目录
- 树形结构开发]菜单维护
- 01-菜单维护-树形结构基础知识-上
- ==在数据库中怎么去表示树形关系==
- ==其实这就是自关联==
- ==我们怎么识别根节点==
- 02-菜单维护-树形结构基础知识-下
- 03-页面显示树形结构-后端-逆向工程
- ==开发的细节：如何避免空指针异常：初始化==
- 04-后端-handler方法中组装-未改进（页面显示树形结构）
- 05-后端-handler方法中组装-改进后（页面显示树形结构）
- 如果可以尽量不要嵌套循环
- ==时间复杂度和空间复杂度的区别==
- 注意事项，这个不仅仅是需要代码知识也很需要数据库知识，假如数据库有问题，代码是不行的
- ==根节点的是没有pid的根节点的pid必为null，连0都不行/如果非要用0代替null那么0也是不存在的数据才行，总之根节点是没有父的，它就是天，并并且必须要有一个根节点==
- 06-页面显示树形结构-过渡-跳转到menu-page页面
- ==下面我们跑起来试试看==
- 跳转页面
- 07-页面显示树形结构-前端-参考demo用假数据显示
- zTree的使用
- 08-页面显示树形结构-前端-使用真实数据（下一篇）
- 09-准备zTree的API文档
- 10-前端-显示图标-分析思路（-页面显示树形结构）
- 11-前端-显示图标-代码实现（-页面显示树形结构）
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_数据库](https://file.cfanz.cn/uploads/png/2023/03/31/14/HFEb5FXeXR.png "在这里插入图片描述")
01-菜单维护-树形结构基础知识-上
需要需要熟悉节点的类型，心里要有东西，才能做到胸有成竹
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_数据库_02](https://file.cfanz.cn/uploads/png/2023/03/31/14/aaa6C8d1a7.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_数据库_03](https://file.cfanz.cn/uploads/png/2023/03/31/14/ePa8be4Pd1.png "在这里插入图片描述")
为什么我们要约定整个树形结构的节点层次最多只能有3层，原因是超过3层就非常复杂了，我们这里暂时不考虑过于复杂的层次结构
在数据库中怎么去表示树形关系
我们知道，在数据库中只能是一列一列的数据，那么怎么去表示树形关系呢
找到这个sql文件，我们看看建表语句
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_父节点_04](https://file.cfanz.cn/uploads/png/2023/03/31/14/f53FR1f17Q.png "在这里插入图片描述")
create table t_menu
(
id int(11) not null auto_increment,
pid int(11),
name varchar(255),
icon varchar(255),
url varchar(255),
primary key (id)
);
alter table t_menu comment '菜单表';![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_java_05](https://file.cfanz.cn/uploads/png/2023/03/31/14/8d8422X760.png "在这里插入图片描述")
数据都可以在这个文件中找到，我们插入数据
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_父节点_06](https://file.cfanz.cn/uploads/png/2023/03/31/14/Sa2e014YQ4.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_父节点_07](https://file.cfanz.cn/uploads/png/2023/03/31/14/d71PdYU30X.png "在这里插入图片描述")
根据我们的观察可以得知根节点可以是null也可以是0，即用null和0表示根节点都是可以的
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_父节点_08](https://file.cfanz.cn/uploads/png/2023/03/31/14/XAO1716c8U.png "在这里插入图片描述")
父节点是0 也可以表示该菜单 是根节点
父节点是null也可以表示该菜单 是根节点如下，只是两种写法而已，思路是一模一样的
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_树形结构_09](https://file.cfanz.cn/uploads/png/2023/03/31/14/KT21CIW25K.png "在这里插入图片描述")
id表示的是这条数据本身的id ，pid表示的是父节点的id
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_数据库_10](https://file.cfanz.cn/uploads/png/2023/03/31/14/R958213VO7.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_java_11](https://file.cfanz.cn/uploads/png/2023/03/31/14/276386L785.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_父节点_12](https://file.cfanz.cn/uploads/png/2023/03/31/14/ae378ZeMT0.png "在这里插入图片描述")
分析上图，我们看出，用户维护、角色维护、菜单维护，他们的父节点都是3，都是权限管理
这样是不是就慢慢可以理解他们之间那层关系了子节点通过pid字段关联到父节点的id字段，建立父子关系。
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_父节点_13](https://file.cfanz.cn/uploads/png/2023/03/31/14/35eU1K07aP.png "在这里插入图片描述")
其实这就是自关联
我们怎么识别根节点
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_java_14](https://file.cfanz.cn/uploads/png/2023/03/31/14/8301644b11.png "在这里插入图片描述")
根节点是没有父节点的，他就像是 天地初开 鸿蒙伊始的盘古，只有后代子孙，没有祖宗，它就是祖宗，
没有父节点的就是祖宗，没有父节点的父节点可以用null（或者0）表示
02-菜单维护-树形结构基础知识-下
数据库里面弄清楚了之后，下一步就是我们怎么在页面去显示出来
因为光数据库里面有也没有用，怎么使用java结合前端知识，把数据展示出来呢
下面我们来看
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_java_15](https://file.cfanz.cn/uploads/png/2023/03/31/14/16LbI8OLZH.png "在这里插入图片描述")
上面说的是后端，前端我们直接用用一个插件来生成即可
实际上就非常简单了
这个插件名叫做 zTree，也是基于jquery的
我们后端只需要传给Ztree即可至于传哪些参数，我们可以看zTree的官方文档
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_java_16](https://file.cfanz.cn/uploads/png/2023/03/31/14/O3c8OCT7KN.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_父节点_17](https://file.cfanz.cn/uploads/png/2023/03/31/14/85888G90Z7.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_java_18](https://file.cfanz.cn/uploads/png/2023/03/31/14/a1bOO795H1.png "在这里插入图片描述")
03-页面显示树形结构-后端-逆向工程
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_树形结构_19](https://file.cfanz.cn/uploads/png/2023/03/31/14/4aZa01JQ7G.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_树形结构_20](https://file.cfanz.cn/uploads/png/2023/03/31/14/2e0QU6eZ05.png "在这里插入图片描述")
建表这块，不说了直接找到数据库文件，执行好表即可（注意表和数据都要） ==
然后我们这里直接就可以执行逆向工程==了
注意，就是这张表，注意执行的逆向工程的时候，如下表名和类名不要写错
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_java_21](https://file.cfanz.cn/uploads/png/2023/03/31/14/Of0WbN73Y1.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_父节点_22](https://file.cfanz.cn/uploads/png/2023/03/31/14/50W7296818.png "在这里插入图片描述")
选择这个是直接执行上一次的，我们这里选择这个就好
我们之前说过，还有两个附加的属性要加上，所以如下我们在实体里面加上
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_java_23](https://file.cfanz.cn/uploads/png/2023/03/31/14/21Aca9EQ02.png "在这里插入图片描述")
除了要给这两个新加的属性添加get、set方法外，我们特别要注意，还需要初始化一下这个
开发的细节：如何避免空指针异常：初始化
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_父节点_24](https://file.cfanz.cn/uploads/png/2023/03/31/14/0c058580c0.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_数据库_25](https://file.cfanz.cn/uploads/png/2023/03/31/14/OZJ71D7444.png "在这里插入图片描述")
每一个属性，都加一下注释
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_java_26](https://file.cfanz.cn/uploads/png/2023/03/31/14/0d0f11dN12.png "在这里插入图片描述")
然后构造器、get、set以及toString方法自己加一下注意是把实体的附加属性弄好了之后再去各就各位
下面就是service和handler
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_父节点_27](https://file.cfanz.cn/uploads/png/2023/03/31/14/6dbRE6J0R8.png "在这里插入图片描述")
使用@Autowired 装配一下 MenuMapper，到时候好层层调用
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_java_28](https://file.cfanz.cn/uploads/png/2023/03/31/14/f893f3c3X2.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_数据库_29](https://file.cfanz.cn/uploads/png/2023/03/31/14/8T0f7Qf874.png "在这里插入图片描述")
这样架子先搭好，再来进行下一步
04-后端-handler方法中组装-未改进（页面显示树形结构）
service接口
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_树形结构_30](https://file.cfanz.cn/uploads/png/2023/03/31/14/Q0TC8846A7.png "在这里插入图片描述")
service实现类
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_java_31](https://file.cfanz.cn/uploads/png/2023/03/31/14/Ic819fXP1P.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_java_32](https://file.cfanz.cn/uploads/png/2023/03/31/14/b64L4Q3I5D.png "在这里插入图片描述")
控制器
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_数据库_33](https://file.cfanz.cn/uploads/png/2023/03/31/14/dQId6d7cIO.png "在这里插入图片描述")
检查pid是否为null，有些数据库设计的时候父节点是0，
pid是null或者0就是根节点，这个要根据具体情况来，具体情况具体分析
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_java_34](https://file.cfanz.cn/uploads/png/2023/03/31/14/LPWc22b7Z2.png "在这里插入图片描述")
父节点可以有多个子节点，子节点只能有1个父节点
05-后端-handler方法中组装-改进后（页面显示树形结构）
改进一下，上面的写法不能说错，只是还不够好
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_java_35](https://file.cfanz.cn/uploads/png/2023/03/31/14/H838f290D1.png "在这里插入图片描述")
如果嵌套的循环能够改成不嵌套的循环，我们要尽量避免嵌套的循环
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_数据库_36](https://file.cfanz.cn/uploads/png/2023/03/31/14/W4HQ6E9P88.png "在这里插入图片描述")
极端情况下，如果循环的次数非常多，由于嵌套循环是外层循环和内层循环相乘，所以是对资源极大的浪费
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_父节点_37](https://file.cfanz.cn/uploads/png/2023/03/31/14/ZbVF915Q81.png "在这里插入图片描述")
1000000000
20000
差别巨大
所以我们只要改成不嵌套就行了
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_java_38](https://file.cfanz.cn/uploads/png/2023/03/31/14/UZJZ7N27a8.png "在这里插入图片描述")
之所以之前嵌套，是找父节点的时候嵌套的
如果可以尽量不要嵌套循环
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_树形结构_39](https://file.cfanz.cn/uploads/png/2023/03/31/14/8S31642928.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_树形结构_40](https://file.cfanz.cn/uploads/png/2023/03/31/14/f0CTW33NfQ.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_java_41](https://file.cfanz.cn/uploads/png/2023/03/31/14/A8OXW08ZS1.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_树形结构_42](https://file.cfanz.cn/uploads/png/2023/03/31/14/8947G8G6B8.png "在这里插入图片描述")
上面我们将双循环/循环嵌套 改成了单循环/普通循环 ，优化的是时间复杂度
时间复杂度和空间复杂度的区别
时间复杂度解决同一个问题，谁运算的次数多，谁运算的次数少，肯定是越少越好
运行次数多的就时间复杂度高，运算次数少的就时间复杂度低，同理，时间复杂度也是越低越好
空间复杂度占用内存的大小，一个算法执行完毕肯定占用内存越少越好，也就是说空间复杂度也是越低越好
如果时间复杂度低，空间复杂度也低，那么这个算法就刘无限牛逼了这个是数据结构相关的知识
注意事项，这个不仅仅是需要代码知识也很需要数据库知识，假如数据库有问题，代码是不行的
上面的代码必须要，保证数据库里面的数据之间是有关联关系的
因为我自己测试不成功所以改了一下
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_树形结构_43](https://file.cfanz.cn/uploads/png/2023/03/31/14/N105WK2f68.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_树形结构_44](https://file.cfanz.cn/uploads/png/2023/03/31/14/QL6FTV8THY.png "在这里插入图片描述")
这样上面的代码就生效了
所以，由此我们可以得出根节点的是没有pid的
根节点的是没有pid的根节点的pid必为null，连0都不行/如果非要用0代替null那么0也是不存在的数据才行，总之根节点是没有父的，它就是天，并并且必须要有一个根节点
我改了数据库的内容之后，他们就能够很好的关联起来了
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_数据库_45](https://file.cfanz.cn/uploads/png/2023/03/31/14/aC48S03066.png "在这里插入图片描述")
最后推荐是用这个算法，不要搞错了
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_父节点_46](https://file.cfanz.cn/uploads/png/2023/03/31/14/ccSJ46LSc0.png "在这里插入图片描述")
小结：zTree，树形开发结构开发，首先要数据库的数据没问题，才能使用java算法把结构理清楚，一句话首先要数据没问题
06-页面显示树形结构-过渡-跳转到menu-page页面
下面我们跑起来试试看
这里 老师讲解的时候用的是火狐浏览器，他主要是为了看JSON，火狐浏览器对JSON自带解析
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_java_47](https://file.cfanz.cn/uploads/png/2023/03/31/14/c610TULc5K.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_java_48](https://file.cfanz.cn/uploads/png/2023/03/31/14/81Q86f07b8.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_数据库_49](https://file.cfanz.cn/uploads/png/2023/03/31/14/AMfK7K0Df8.png "在这里插入图片描述")
跳转页面
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_树形结构_50](https://file.cfanz.cn/uploads/png/2023/03/31/14/a0SO4EEBC1.png "在这里插入图片描述")
没有这个menu-page页面的话，我们就新建一个
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_树形结构_51](https://file.cfanz.cn/uploads/png/2023/03/31/14/364P0717ZG.png "在这里插入图片描述")
打开前端页面
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_树形结构_52](https://file.cfanz.cn/uploads/png/2023/03/31/14/R04dV057cY.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_java_53](https://file.cfanz.cn/uploads/png/2023/03/31/14/HdYV898c71.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_父节点_54](https://file.cfanz.cn/uploads/png/2023/03/31/14/7VNB1D6bP9.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_父节点_55](https://file.cfanz.cn/uploads/png/2023/03/31/14/0976943611.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_java_56](https://file.cfanz.cn/uploads/png/2023/03/31/14/5WI1f4a7Vf.png "在这里插入图片描述")
07-页面显示树形结构-前端-参考demo用假数据显示
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_树形结构_57](https://file.cfanz.cn/uploads/png/2023/03/31/14/b4a831GZ8J.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_父节点_58](https://file.cfanz.cn/uploads/png/2023/03/31/14/SDAf79e793.png "在这里插入图片描述")
所以我们也要引入zTree的环境
zTree的使用
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_java_59](https://file.cfanz.cn/uploads/png/2023/03/31/14/H5SCNX724K.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_java_60](https://file.cfanz.cn/uploads/png/2023/03/31/14/0BZ2RfN157.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_数据库_61](https://file.cfanz.cn/uploads/png/2023/03/31/14/159c34210e.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_数据库_62](https://file.cfanz.cn/uploads/png/2023/03/31/14/VAebfadaf3.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_数据库_63](https://file.cfanz.cn/uploads/png/2023/03/31/14/V1ZOT2K0cQ.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_java_64](https://file.cfanz.cn/uploads/png/2023/03/31/14/691G41Kb96.png "在这里插入图片描述")
其实zTree功能非常丰富 但是弱水三千，我只取一瓢，我们只要能够满足我们的部分就可以了
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_java_65](https://file.cfanz.cn/uploads/png/2023/03/31/14/1382J17d74.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_父节点_66](https://file.cfanz.cn/uploads/png/2023/03/31/14/ELOI5R2c0d.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_树形结构_67](https://file.cfanz.cn/uploads/png/2023/03/31/14/17b111ca6X.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_java_68](https://file.cfanz.cn/uploads/png/2023/03/31/14/Q8486Se6M1.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_数据库_69](https://file.cfanz.cn/uploads/png/2023/03/31/14/c9R2DH79F7.png "在这里插入图片描述")
先看看有没有所谓的"假数据"页面
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_java_70](https://file.cfanz.cn/uploads/png/2023/03/31/14/88a31YSD3e.png "在这里插入图片描述")
我们的代码里面也要有 treeDemo其它的就删掉，会动态生成
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_树形结构_71](https://file.cfanz.cn/uploads/png/2023/03/31/14/I776SR5ID0.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_数据库_72](https://file.cfanz.cn/uploads/png/2023/03/31/14/4W5bMNcC24.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_java_73](https://file.cfanz.cn/uploads/png/2023/03/31/14/fae80636H2.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_父节点_74](https://file.cfanz.cn/uploads/png/2023/03/31/14/68fTY163R7.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_树形结构_75](https://file.cfanz.cn/uploads/png/2023/03/31/14/681Ea80a63.png "在这里插入图片描述")
测试一下：
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_树形结构_76](https://file.cfanz.cn/uploads/png/2023/03/31/14/70Z60EbYdd.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_数据库_77](https://file.cfanz.cn/uploads/png/2023/03/31/14/STZSdT3048.png "在这里插入图片描述")
![项目一众筹网05_01_[树形结构开发]菜单维护-树形结构基础知识、自关联、zTree的介绍和使用、如果可以尽量不要嵌套循环、时间复杂度和空间复杂度的区别_父节点_78](https://file.cfanz.cn/uploads/png/2023/03/31/14/Qe83fN1725.png "在这里插入图片描述")
08-页面显示树形结构-前端-使用真实数据（下一篇）
09-准备zTree的API文档
10-前端-显示图标-分析思路（-页面显示树形结构）
11-前端-显示图标-代码实现（-页面显示树形结构）
