00:00
然后呢,我们这个再下一步这个span里边,现在这个A标签,就A这个字母是个假的啊,这是临时放在这儿,哎,这个下一步呢,就是我们把它换成这个实际的这些按钮。这里边儿需要注意的就是这个按钮啊。不是每个节点都一样的。呃,它一共有三个按钮。一共有这么三个按钮。这个是增加子节点,这是删除当前节点,这是修改当前节点。这三个呢,得根据这个节点的情况啊,他们有不同的这个规则。呃,所以说呢,在这儿哈,就是呃。你看这个在在这儿吧,在这儿来看一下啊。嗯。按钮增删改查的规则。这个得看你这个按钮是哪一个级别的按钮呢,是有级别的。
01:05
这个级别呢,我们看一下啊。哎,这个也是从object这里边儿呢,有一个属性叫level。来是用1234表示的,如果是根节点的话。Level是一不是。那这是控制面板哈,这系统权限菜单呢。嗯。这个没有打印系统权全在在这啊,它放到最后了。这个level是零。哎,Level是零,然后呢,比如说我们再去看一个。呃,再找一个。这个项目分类呢,这个level是二。一共就这三集。啊,所以说就说它是它的level是零。哎,他们的level是一,像这种的话level是二。
02:02
不同级别的话,这个不一样啊,咱们去分不同级别来说。LEVEL1。首先是LEVEL0啊,这是这个根节点,它呢可以做的事情呢,只有这个添加子节点。不能改也不能删啊。这是根节点。然后呢,这个LEVEL1诶。呢,就是我们的分支节点。分支节点呢,呃,它可以这个修改,可以这个添加子节点。但是能不能删这个得分两种情况,一个是这个。如果没有子节点。那么就可以删除。啊,如果说呃,有子节点。
03:04
不能删除。LEVEL2。这个是叶子节点。这个当然可以修改。啊,但是它已经是最下边一级了,它就不能添加子节点了,那它可以删除。啊,可以删除。这就是他们我们添加这个按钮的一个规则。下边我们去准备这些按钮呢,就得是遵照这个规则去把它们给加进去。哎。我们在此之前呢,咱们先得把这个按钮的这些HR标签呢,先得给它这个准备好。嗯。在这哈,我们说这个事儿,呃,准备。各个按钮的HTL的这个标签,我们一共是三个按钮。
04:00
哎,一个是这个。爱的。But。呃,一个呢,是这个叫。Remove。一个呢是修改的edit button。这个HR标签都是什么呢?咱们还得看这哈,这是修改的。嗯,这个复制过来CTRLC。这是修改的哈,放在这儿那不行,咱们得把它替换一下。嗯,我把另外几个也都拿过来吧。这是删除的。呃,还一个添加子节点。
05:08
CTRLF去替换一下把。双引号换成单引号。哎。然后这个是,呃。呃,这是个to狗哈,这个图标呢,是个edit,哎,这是一个修改的。嗯,CTRLX。修改的放在放在这儿。哎,然后呢,下边这个是我们的这个。删除的。Times只是一个删除的。剩下这个是一个添加的。这个plus。哎,这是他们的HR标签呢,给他们准备好啊,这里边这个这些个样式,这个咱们就就就是不不不一个不详细去看他这些了。
06:08
呃,另外这两个呢,也可以给他去加一个title。它会有一个提示哈。哎,这是一个添加子节点。哎,这个是删除节点。这个呢是修改节点。还有呢,我们为了让将来这个超链接哈,这边我们知道他,呃要要操作的是谁啊,你添加的时候,你给他添加子节点,你得知道当前节点就是新的节点的父节点是谁,给他设置一下这个ID。哎。这个ID呢?从这个note里边访问ID属性就行。
07:00
啊,就是因为我们说了吹node里边是所有的,就是menu对象的所有的属性,在吹note里边都有访问ID属性的话,就拿到它的这个主件。每一个都把这个加上。那么将来呢?为了他们能够便于定位到他啊,将来给他绑定。啊,这个绑定显示函数哈,这个绑定显示函数呢,这个已经就是说。我之前试的呢,用on的方式都不行了啊,所以这个吧,就是这个咱们就这样去写了,这个叫做on click。呃,等于一个方式。嗯。得调一个函数啊,这个比如说呢,叫做收。Addd model。里边呢,还得给他把this穿进去。这个要不等做到这儿再说吧啊。这个现在先别管他了。这是按钮的这个标签,这个就准备好了,然后呢,按照我们的规则给它加到这里边儿。哎,这边呢,所以说为了知道它的规。
08:04
为了对应规则的话,我们得知道当前节点的级别啊,获取当前节点的。级别数据。Level等于node。点。Level。哎,然后呢。嗯,判断一下。哎,判断当前节点的级别。当前节点呢?如果它等于零,说明是根节点。那么我们就是呢,要这个,呃,添加子节点这一个就行。嗯,我想想啊。这样我们去声明一个变量。去存储,呃。整个啊,去存储那个拼装好的。
09:00
哎,这个按钮。按钮的代码。我们一个button的HTML。先等于一个空字符串吧。哎,这个八呢,如果等于零的话。我们就等于。把这个给它加进来哈。我想啊。拼足串啊,拼足串就它本身是个空轴串啊,就然后是把这个加上。呃,给他赋值附进去。然后呢?如果。Level等于一。呃,那么我们这边不光要呃加这个level等于一的时候呢,是可以修改可以添加,哎,这两个是都要加进来的。
10:03
然后呢,下边就加一个碳。不用加这个也行啊。不用加这个就是拼嘛,就。然后说这个中间呢,给它们加个空格,让他们有个距离。哎,然后呢,在这种情况下呢,还得判断一下有没有分支节点,呃,有没有子节点啊,获取当前节点的子节点。嗯,这个呢,就是直接点呢,直接就数量吧。这个认识哈。这个就等于吹node。去访问这个children。然后呢,加。哎,那么判断一下,如果这个length。等于零。那就是没有,没有的话呢,就可以去加。
11:02
哎,这个是在原有的这个基础上再加上一个。呃,就是可以删啊,它可以删,没有子节点就可以删除。嗯。如果说不等于零就不加这个,那就不用写了啊,不用写,不用就是这个另外一个if条件,或者说这个else,这个不用写,因为else的时候你不加就完事了,这边什么都不用做啊,所以这个就不用加了。再往下呢,如果这个level是。等于二。啊,那这个时候其实是它不能加子节点,就没有这个啊,可以改可以删。等于edit。加上一个。空格再加上一个。然后把这个准备好了以后,放到这里边儿去一拼。
12:09
哎。我们在这儿写下啊。级别为零时,是根节点。放下边说吧,哎,根节点啊,只能添加子节点。哎。级别。为一时,是分支节点。嗯。可以。添加子节点。呃,然后呢,可以修改。哎,说如果。如果。没有子节点,那么可以删除。然后这个level为二的时候。
13:05
级别为20。是叶子节点啊。它可以修改删除。好了,哎,这个我们就拼好了,这个拼好以后呢,咱们去页面上咱们看一下这个效果。嗯。哎,这个是可以改可以删,可以改可以加。啊,它只能够加啊不对,这是这是人家那个圆形。我们应该看这个。我们这个,那我们这个也是对的啊,也是对的。但是你看这个不行是吧,看这个本来也也好用的是吧。没反应过来。啊。
14:02
行好嘞啊。
我来说两句