最近公司需要做一个功能,就是做公司的组织架构,网上找了很多,借鉴几位博主的文章加自己的功能写一篇文章把
基于element-ui实现vue-org-tree树状功能
借鉴的博主详解树状结构图 vue-org-tree - 疯狂的严先生 - 博客园
vue2-org-tree 基于VUE的部门组织架构组件,增删节点实现 - blueToWhite - 博客园
安装那边几位博主写的很详细,我就说一下其他的,我现在要在每个子节点下面多一个下拉框显示增加修改删除,所以我用到了有个方法,发现组件提供的API里面有自定义渲染方式的prop:renderContent ,结合elementui的下拉菜单组件开发
官方代码:
通过鼠标点击事件实现一个下拉菜单:
renderContent(h, data) {
return (<el-dropdown trigger='click' oncommand= {(command) => this.handleAddDel(command)}>