使用vue-echarts后给图表添加事件

在vue项目中有时候会用到封装过的echart组件 vue-echarts

在图表渲染后可能会有添加鼠标事件的操作

在echarts中添加事件是这样的

var myChart = echarts.init(chartDom);

myChart.on('click', (param) => {
    
    // x轴值: param.name
    // y轴值: param.data
    // console.log(param)

    // test
    alert(param.name + "-----" + param.data.value)
    console.log(param.name)
    console.log(param.data)

});
 

在使用了vue-echarts后自己的代码中没有init这一步操作，那么怎么去添加点击事件呢

在dom元素中添加ref属性

<v-chart :options="options" autoresize ref="echart" />

在方法中获取到图的dom元素，即可添加事件，需要找到这一层才可以添加

 

chartE