问题:
vue项目中,echarts在手机端ios一个页签与另一个页签之间多次切换后,导致echarts不能重绘
分析:
echarts频繁画图的时候造成内存泄漏,比较吃内存,echarts实例对象大,占用内存过多,导致不能重新渲染
解决:
- 不要把chart实例赋值在this上。(this对象一直存在不会被回收,如果放的话要把对象置成null)
- 新版本echarts不支持对一个dom多次创建实例。
- 释放生成的echarts对象。
//-dom 不存在时不画
if (!this.$refs.chartContent) {
return
}
//- 不要重复初始化
let myChart = echarts.getInstanceByDom(this.$refs.chartContent)
if (!myChart) {
myChart = echarts.init(this.$refs.chartContent, null, { renderer: 'svg' })
}
//- 释放对象
beforeDestroy() {
let myChart = echarts.getInstanceByDom(this.$refs.chartContent)
if (myChart) {
echarts.dispose(myChart)
}
}