vue项目echarts在IE下内存不释放问题改善

前言

在谷歌浏览器下完全不存在这个问题，但到了IE11下，echarts在绘制大量数据的折线图时，内存涨上去后，注销折线图所在的div也不见内存下降，后来找了网上很多人的解决办法，虽然内存没有被完全释放，但也比每次100~200M的暴涨要好。

H5代码

<template>
  <div
    ref="Chart1"
    style="width:100%;height:100%; margin: 0;"
  />
</template>

初始化

在初始化的同时，添加组件destory之前销毁echarts图的代码，并调用IE浏览器的内存回收函数

initChart() {
      const chart1 = this.$echarts.init(this.$refs.Chart1, this.$store.state.theme)
      this.$once('hook:beforeDestroy', function() {
        chart1.dispose()
        if (window.CollectGarbage) {
          window.CollectGarbage()
        }
      })
    }

获取对象

注意：echarts的对象不能保存在vue的this中，所以每次获取echarts图对象的代码为

getChart1() {
      try {
        return this.$echarts.getInstanceByDom(this.$refs.Chart1)
      } catch {
        return null
      }
    }