形容:
要求点击highcharts中的某个元素,如下图中的蓝色bubble,点击蓝色bubble将“汇添富翻新将来18个月”这个参数传递到父元素中,父元素中有一个表格展现所点击的bubble对应基金的详情。
这就要求在点击事件产生时,把参数传递到上一层。
上面以跳转为例,阐明如何传递参数
(跳转:传递基金的参数,父元素解决,跳转到指定基金的页面)
咱们在vue的methods里定义两个办法,一个是jumpFundDetail,另一个是exportData。
jumpFundDetail接管参数,负责跳转的具体逻辑。
exportData就是一个函数,接管highcharts点击事件向上传递的参数。
上面是重点
在vue的computed属性中定义一个 customizedOptions函数,在这个函数中将exportData引入。customizedOptions返回一个对象,这个对象中定义了click事件,在click事件中通过exportData函数,将参数传递到highcharts的下层。
留神代码中的两个this指向。
绿色框框的this指向vue实例。
蓝色框框的this指向点击事件点击的highcharts 绘制出的元素。
最初
stockOptions.plotOptions = this.customizedOptions
同步更新到本人的语雀
https://www.yuque.com/diracke...