Vue echarts 繫結事件重複執行問題

Silence77發表於2018-06-05
VueEcharts事件

1.起因

在用柱狀圖的時候，繫結click事件，跳轉新的頁面。 由於支援圖表與資料進行切換，切換多少次，就會發現開啟多少個新的頁面。

2.解決方案

將原先DOM容器清空，後重新生成。

    <div ref="wrap">
        <div id="chart-0" style="height: 380px;"></div>
    </div>
複製程式碼
this.$refs.wrap.innerHTML = '<div id="chart-0" style="height: 380px;></div>'
this.myChart = echarts.init(document.getElementById('chart-0'))
this.myChart.clear()  //只是清理畫布，而不會刪除 生成的元素節點
this.myChart.setOption(option)
this.myChart.on('click', () => {})複製程式碼

相關文章