最近在使用Vue開(kāi)發(fā)項(xiàng)目時(shí)，發(fā)現(xiàn)在使用Echarts圖表庫(kù)時(shí)會(huì)產(chǎn)生沖突。具體表現(xiàn)為，當(dāng)我在Vue組件中引入Echarts并且注冊(cè)圖表后，Vue組件和圖表都無(wú)法正常渲染。

經(jīng)過(guò)一番搜尋資料，發(fā)現(xiàn)這是由于vue和echarts使用了同樣的

window.addEventListener('resize', chart.resize);

語(yǔ)句，導(dǎo)致沖突。解決方法比較簡(jiǎn)單，只需要在Echarts注冊(cè)時(shí)，將resize事件注釋掉即可。

created() {
// Instantiate Echarts
this.myChart = this.$echarts.init(this.$refs.myChart);
// Register chart
this.myChart.setOption(this.option);
// Disable resize event
// window.addEventListener('resize', this.myChart.resize);
}

通過(guò)這種方式，我們就能夠解決Vue和Echarts之間的沖突問(wèn)題，順利使用圖表庫(kù)完成我們的項(xiàng)目。