前言：
在做公司管理系统的小伙伴们，应该会遇到要写组织架构图的时候，我们之前的第一选择的库十有八九是OrgChart.js，它很多优点，性能好、功能强大，但是！ 它现在有个非常大的缺点，就是要收费了，吝啬的老板不愿意出钱，只能把之前写好的功能，找其他库代替，再写一遍了。
通过我九牛二虎之力（直接问ai），终于找到替代品，那就是vue3-tree-org了，看名字就知道这个库跟vue3深度绑定的，对于vue3项目非常友好。
对比：
下面说一下OrgChart.js跟vue3-tree-org的对比。
- OrgChart.js能适用于任何框架项目上，而vue3-tree-org只能用在vue3项目上，OrgChart.js拿1分。
- OrgChart.js是直接操作svg，性能更高，而vue3-tree-org是直接操作dom节点，性能更垃，OrgChart.js拿1分。
- OrgChart.js可以支持更加多的样式修改，而vue3-tree-org只能有限的修改节点样式，OrgChart.js又拿1分。
- OrgChart.js要收费，而vue3-tree-org免费，vue3-tree-org拿100分。
好了，玩笑开完了，我写这篇东西最主要还是为了记录一下这个库，方便以后遇到同样的功能的时候，能快速开发上手，接下来是vue3-tree-org的使用。这里顺便丢个官方文档出来。
第一步：安装
太基础了，不想写，实在不懂的去看官方文档，上面有写。
第二步：引入
还是太基础了，老实说，能看到这篇文章的，基本都是大大了，这种基础东西不写了。
第三步：二次开发
我们吝啬而要求多的老板，肯定不想用原本的样式，就喜欢有不一样的感觉，就让UI一顿改，如果老板不搞偏离组织架构图的功能需求，这个库其实是够用的了，够你改的了，我们能修改的有节点、节点展开按钮、右键菜单等，因为是html节点渲染的，所以其实也能通过css去直接修改原本样式，例如连接线的样式等。
节点跟节点展开按钮都可以通过插槽来自定义，下面是示例代码
这两个插槽都只有一个参数，就是node，里面存放着我们的节点数据，我们可以根据节点的数据来显示我们想要的东西，上面的代码只是一个简单的示例，我们到最后可以改出很多复杂的样式出来，
结语
这个库很简单，容易上手的，能写的东西也不多，单纯是记录一下，让各位大大多条路来选择。再见！
