多选框和Echarts的点击事件产生了莫名奇妙的关联，应该如何解决？

Question

前端框架-ant design vue
代码描述：
使用

<a-checkbox-group style="margin-left: 10px;" v-model="Options.checkPoint"  :options="checkPointOptions" @change="onChange_Options" />

做了一个多选框，当选项发生变化时触发onChange_Options，这个函数会触发几个判断，之后再触发两个函数getValue()获取table表格数据和changeEcharts()获取Echarts图数据及生成饼形图，这两个函数会使用Options做为参数传给后端，在点击Echarts图后会触发Echarts的点击事件，更改Options.type的内容，之后再执行getValue()
出现的问题：点击Echarts图后正常应该触发一次Echarts的点击事件，但是，发现点击多选框的时候，点击选项几次，Echarts的点击事件就会触发几次，但是整个代码中没有使用任何循环，也没有记录多选框的点击次数，想知道这个问题出在哪里，应该如何解决

Answer 1

参考GPT和自己的思路：这种情况很可能是由于事件绑定的处理逻辑中存在一些问题导致的，建议仔细检查一下相关代码，确保事件绑定的顺序和逻辑正确。另外，也可以考虑使用Vue的事件修饰符来限制事件执行的次数，比如使用.once来确保事件只执行一次。如果问题还存在，建议尝试使用调试工具逐步定位问题所在。