首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

vue+elementUI树形节点增删改功能代码

因为项目中用到设计一个树形分支,可以灵活添加子节点,并且随时修改和删除,所以研究了一下vue+elemnetui的该功能,非常强大,做一些笔记分享。

效果图如下:

elementUI组件:

数据

渲染method

tree_render Component渲染组件

添加按钮

用来切换和的显示状态,首先加个input

编辑按钮消失条件

编辑完按enter

点击其它节点

点击当前节点范围

6. 增加节点

新增的同时展开父节点

是否考虑无限新增

7. 删除节点

新增节点直接删除

已有节点需提示再删除

已有子节点不能删除

  • 发表于:
  • 原文链接https://kuaibao.qq.com/s/20191009A0D7G600?refer=cp_1026
  • 腾讯「腾讯云开发者社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。
  • 如有侵权,请联系 cloudcommunity@tencent.com 删除。

扫码

添加站长 进交流群

领取专属 10元无门槛券

私享最新 技术干货

扫码加入开发者社群
领券
http://www.vxiaotou.com