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

详情看图注释
上一篇下一篇

猜你喜欢

热点阅读