Tree组件
2021-08-07 本文已影响0人
沃德麻鸭
Tree树形组件
什么是树形数据?
有一些业务场景在描述主体关系(组织架构 人员关系)的时候必须使用树形数据,比如:我们常见的家庭成员关系图,公司里的组织架构等,要描述这样的业务场景,与之对应的,我们就得给出树形结构的数据
学习树状结构的数据和label , children属性
代码示例上面我们就完成了一个基础树形组件的渲染,依赖一个data属性即可,data属性传入的就是树状结构
配置自定义渲染字段
tree组件渲染节点title默认使用的是数据中的label属性,识别子节点默认使用的是children属性,我们尝试把data里的属性名换一下,例如:label换成name,children换成childList,就会发现渲染失败了。
如果你非要去自定义这个两个关键字:label和children的话,就需要用到props属性了。
如下:
自定义关键字
获取特定树形节点数据
当我们点击某个树形子节点的时候,如何获取到当前点击这项节点对应的数据?
监听事件:@node-click="handleNodeClick
详情看图注释