本文实例讲述了vue实现的树形结构加多选框。分享给大家供大家参考,具体如下:
创新互联公司是一家专业提供裕民企业网站建设,专注与网站建设、网站设计、HTML5建站、小程序制作等业务。10年已为裕民众多企业、政府机构等服务。创新互联专业网站制作公司优惠进行中。前面说了如何用递归组件来写vue树形结构,写了树形结构还要在前面加多选框,然后往数组里push选项,并在左边显示出来,然后左边进行拖拽排序,拖拽排序上一篇文章我已经介绍过了,在这我就不介绍了,如何用阿里巴巴矢量图标库我也有相关文章,也不介绍了,本节主要介绍vue树形结构加多选框,并实现一定的逻辑,比如全选,单选,全选和单选之间的联动
先看下目录结构
下面我直接贴下代码
首先是pages文件夹中tree.vue页面中引用组件
下面是tree.vue的代码