当前位置:首页 » 《随便一记》 » 正文

echarts实例的清空与销毁-clear/dispose

21 人参与  2024年03月31日 15:55  分类 : 《随便一记》  评论

点击全文阅读


clear和dispose是echarts提供的用于解决内存溢出的方法 

    import * as echarts from "echarts";        // 销毁实例    desHander(){        let myChart = echarts.init(this.$refs["chartDom"]);        // 销毁实例,销毁后实例无法再被使用。        // 在什么情况下需要调用该函数进行销毁当前的实例呢?        // 官方给的说明:在图表容器被销毁之后,调用 echartsInstance.dispose 销毁实例,        myChart.dispose();    },    // 清空当前实例    clearHander(){        // 清空当前实例,会移除实例中所有的组件和图表。        let myChart = echarts.init(this.$refs["chartDom"]);        myChart.clear()     },    init(){        this.clearHander()          //或者        this.desHander()        let myChart = echarts.init(this.$refs["chartDom"]);    }

内存溢出:当程序运行时需要的内存超出了当前应用系统的剩余内存时,就造成了内存溢出的情况,直观表现就是——卡死。

所以只要使用echarts了,最好都clear或dispose一下。

echarts.clear()是清空当前实例,会移除实例中所有的组件和图表。

echarts.dispose()是销毁实例,销毁后实例无法再被使用。

我觉得clear和dispose就类似于v-show和v-if

clear类似于v-show,它只是重绘图表

dispose类似于v-if,它是将echarts对象清理了,然后重新构建echarts对象

如果连图表容器都被销毁了,那就要调用echarts.dispose()销毁实例

使用场景:当echarts图表的数据是动态更新然后渲染图表时,哪怕我们使用watch去监听了数据的变化,已经拿到了更新的数据,但是图表却没有进行相应的渲染,clear或dispose一下。


点击全文阅读


本文链接:http://zhangshiyu.com/post/88539.html

<< 上一篇 下一篇 >>

  • 评论(0)
  • 赞助本站

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

关于我们 | 我要投稿 | 免责申明

Copyright © 2020-2022 ZhangShiYu.com Rights Reserved.豫ICP备2022013469号-1