arco-design-vue的tree组件实现右击事件

arco-design-vue的tree组件实现右击事件

业务中需要使用到tree组件，并且还要对tree实现自定义鼠标右击事件。在arco-design-vue的文档中，可以明确的看到，tree组件并没有右击事件的相关回调，那要如何实现呢？？？
这里提供两种思路：
1、使用插槽，在插槽中对DOM实现contextmenu事件（会有问题，下面会说）
2、使用事件冒泡机制，对tree实现contextmenu事件

思路一：使用插槽对自定义实现contextmenu事件

本以为这样就万事大吉了，万万没想到测试给我提了一个bug。这个右击事件，“顾尾不顾头”，即在节点前面的空白地方右击无效。

使用开发者工具看了DOM结构才发现，使用插槽的话，是永远在arco-tree-node节点内，而这个DOM中同时还包括了缩进、间距、内容（插槽所在dom）。这三部分都是有自己的宽度的，所以当右击缩进和间距的时候，右击事件不会触发。所以如果想要当前行不管哪里右击都能触发自定义右击事件的，果断放弃这种方式吧

思路二：使用冒泡机制，直接将右击事件绑定到tree组件本身上

查看过arco-design-vue文档的小伙伴都知道，tree组件并没有提供contextmenu相关的回调函数，那怎么办呢？去github上看了，有这个需求的人不止我一个。但是到目前为止，没看到官方宣布提供了啥解决方案。
那怎么办？难道不实现了吗？还是说为了这个功能用其他tree插件来实现？？不行，我不甘心啊！！！！
不死心的我终于在事件对象中知道到了“蛛丝马迹”。打印事件对象之后，发现这个事件对象的target属性值，多了两个属性： __vnode 和 __vueParentComponent。我们想要的数据会不会就在这两个属性值里？？？？
通过不断的进行验证，果然验证了我的猜想，数据就藏在__vueParentComponent中。（皇天不负有心人啊，5555…）

这里我需要说明一下，每个节点的唯一标识我本来使用的是"key"，但是这个attrs打印出来中没有这个属性，不光这个属性没有，我定义的节点类型中的title、isLeaf属性也没有。没办法就再加了一个id属性来存储节点的唯一标识值。（我猜测的是，这个attrs只能打印那些不被子节点props定义的属性，可能arco-design-vue的tree内部，所有 TreeNodeData 定义的属性都默认被props接收，所以打印不出来）
好了，到此问题解决了。如果有更好的解决办法，欢迎在评论区一起他讨论呀。