echarts配合vue2点击图表传递数据到另一个页面

原因：

最近公司需要echarts配合vue2去点击图表中的图之后获取图标数据传递到另一个页面的功能

 

解决方案：

let _this = this //因为echarts当中的this并不是vue的实例vueCompoent,所以需要定义一个变量名接收
option && myChart.setOption(option);
myChart.on("click", function (a) { //echarts的点击事件并且带有点击之后获取的参数
   _this.$router.push({  //这里因为接受的this，所以可以取到$router
   name:"你需要跳转的页面",  //如果用params传参的话就必须用name进行跳转
   params:{...a} 
   })
});

//跳转之后接受传过来的值
mounted() {
    let form = this.$route.params;
},

公司因为是跳转之后还要进行调用接口，所以用了params进行传参，如果需要缓存则可以使用query进行路由传参

用到的技术栈：

vue2,echarts