美文网首页
Tree组件

Tree组件

作者: 沃德麻鸭 | 来源:发表于2021-08-07 20:20 被阅读0次

    Tree树形组件

    什么是树形数据?

    有一些业务场景在描述主体关系(组织架构  人员关系)的时候必须使用树形数据,比如:我们常见的家庭成员关系图,公司里的组织架构等,要描述这样的业务场景,与之对应的,我们就得给出树形结构的数据

    学习树状结构的数据和label  , children属性

    代码示例

    上面我们就完成了一个基础树形组件的渲染,依赖一个data属性即可,data属性传入的就是树状结构

    配置自定义渲染字段

    tree组件渲染节点title默认使用的是数据中的label属性识别子节点默认使用的是children属性,我们尝试把data里的属性名换一下,例如:label换成name,children换成childList,就会发现渲染失败了。

    如果你非要去自定义这个两个关键字:label和children的话,就需要用到props属性了。

    如下:

    自定义关键字


    获取特定树形节点数据

    当我们点击某个树形子节点的时候,如何获取到当前点击这项节点对应的数据

    监听事件:@node-click="handleNodeClick

    详情看图注释

    相关文章

      网友评论

          本文标题:Tree组件

          本文链接:https://www.haomeiwen.com/subject/pdsmvltx.html