在群里看到一个题目
渲染一个树状结构，节点可以拖拽，实现以下特性
0.节点可以展开/收缩
1.将S从上/下方拖过上一个节点T的中位线时，S节点占位移动到T节点的位置。
2.将S节点拖入T节点20%-50%或50%-80%位置区间，但未穿过50%时，如果停留时间超过0.5秒，则将S节点加入T的子节点，并展开T节点。
3.当用户释放正在拖拽的S节点时，调整节点从属关系。
要求所有视觉由流畅的动画表现。请梳理其中数据流关系。题目给了一个dome，如下
代码连接：
实现代码连接： codepen.io/fengmumu1/p…
实现的效果，点击链接，或者直接到最底部看啦，
这里记录一些个人认为需要说明的一些东西，
我自己实现的思路如下：
- 首先实现根据数据渲染出一个树形的表
- 实现表格的点击缩进展开功能（通过更改数据的对应标记实现）
- 实现拖动元素的各种交互
- 从拖动的结果得出初始的数据和结束的数据，然后修改数据
一些自己的碎碎念
- 没有过多的dome特效，我个人理解的是，根据数据生成dome，尽量减少对dome的修改，修改让框架自己来做，所以我用了 css 来做，还有一个就是 尽量的少对 dome 做操作，尽可能的减少回流。
- 数据之间的交换是需要注意的，不同的层级和不同的位置之间的数据交换需要注意一下数据操作的顺序
- 代码比较烂，基本就是按照想法做完就完了，然后收工吃饭啦
实现的效果
