C/C++教程

【Echarts】Echarts图形随窗口自适应大小resize。Echarts造成内存泄漏影响性能处理办法

本文主要是介绍【Echarts】Echarts图形随窗口自适应大小resize。Echarts造成内存泄漏影响性能处理办法,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!

Echarts图形随窗口自适应resize

    // 对__resizeHandler事件进行防抖处理
    this.__resizeHandler = debounce(() => {
      // 对当前实例图形进行resize自适应窗口大小
      if (this.chart) {
        this.chart.resize()
      }
    }, 100)
    // 监听当前视窗resize事件,事件名__resizeHandler
    window.addEventListener('resize', this.__resizeHandler)



Echarts进行路由切换时,每次实例化echarts并没有对其进行销毁,若当前页面上有多个echarts图形时,容易产生内存泄漏。因此需要在钩子函数中及时销毁echarts实例。

  beforeDestroy() {
    // 若当前未实例化,则跳出
    if (!this.chart) {
      return
    }
    // 移除当前事件窗口自适应的事件
    window.removeEventListener('resize', this.__resizeHandler)
    // 销毁实例,实例销毁后无法再被使用
    this.chart.dispose()
    // 手动进行垃圾回收,释放内存
    this.chart = null
  },
这篇关于【Echarts】Echarts图形随窗口自适应大小resize。Echarts造成内存泄漏影响性能处理办法的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!