場景
兩個按鈕盛垦,點擊按鈕A湿弦,彈出彈窗,在彈窗的彈出回調(diào)中根據(jù)按鈕功能請求數(shù)據(jù)腾夯,然后獲取彈窗中的echarts
容器颊埃,調(diào)用echarts
的init
方法,得到echarts
實例俯在,然后配置option
竟秫,最后調(diào)用setOption
方法渲染娃惯,折線圖顯示正常跷乐,然后關(guān)閉彈窗,點擊按鈕B,重復(fù)上面的步驟趾浅,但是最后渲染出來的折線圖錯亂愕提。
操作
點擊按鈕A,數(shù)據(jù)顯示正常,然后關(guān)閉彈窗
點擊按鈕B,折線圖錯亂
總結(jié)
出現(xiàn)上面的情況后皿哨,刷新頁面再打開就正常浅侨,但是如果先打開A彈窗,再打開B彈窗证膨,還是會出現(xiàn)上面的情況如输,混亂后的折線圖就好像是上個彈窗里面折線圖的數(shù)據(jù)緩存,所以就查找echarts
文檔央勒,查看有沒有清楚緩存或者其他什么方法
解決
方法一:echarts.dispose()
在調(diào)用
init
方法初始化echarts
實例前不见,先使用'echarts.dispose()'方法銷毀echarts
實例這個方法是
echarts
的方法,不是echarts
實例的方法崔步,是直接銷毀echarts
實例稳吮,所以要在初始化實例前使用
me.$echarts.dispose(me.$refs['allWeekEcharts'])
var allWeekEcharts = me.$echarts.init(me.$refs['allWeekEcharts']);
allWeekEcharts.setOption(option,true)
方法二:echartsInstance.clear()
在調(diào)用
init
方法得到echarts
實例后,再使用實例的‘clear()’方法井濒,清空實例中的所有組件和圖表這個方法是
echarts
實例的方法灶似,所以要在使用init
獲取實例后列林,再調(diào)用這個方法
var allWeekEcharts = me.$echarts.init(me.$refs['allWeekEcharts']);
allWeekEcharts.clear()
allWeekEcharts.setOption(option,true)