项目场景:
uniapp+echarts+H5移动端
问题描述:
给图表添加点击事件,发现点击图表没有触发点击事件
const chartCon2 = this.$echarts.init(document.getElementById('con2'));
// var chartCon2 = echarts.init(this.$refs.echart);
chartCon2.on('click', function (params) {
console.log(params);
});
原因分析:
大概猜测就是版本不兼容或者哪里冲突导致点击事件失效
解决方案:
方法一:
降级echarts版本 ,缺点降级后图表样式出现变化,需要自己手动调整。
执行卸载echarts命令:
npm uninstall echarts
安装一个低版本echarts:
npm install echarts@4.1.0
方法二:
不需要降版本,只需要在获取echarts的时候添加两句以下代码
this.$echarts.env.touchEventsSupported = false;
this.$echarts.env.wxa = false;
如果里面大量使用echarts可以统一找个地方添加,下面截图是放到app.vue: