[问题探讨]H5移动端无限懒加载echarts图表引起的IOS闪退问题

背景：Vue+Echarts+mintUI开发移动端app

问题：Echarts图表在IOS端懒加载多个时出现闪退

问题分析：

频繁操作App直到闪退出现，监控内存使用情况后发现，在操作过程中内存一直升高，到600M时软件闪退；

考虑从两方面解决：

一，减轻echarts图表渲染的压力(只渲染视口内的图表)；

二，抑制频繁请求，减轻内存压力(抑制无效请求)；

一，减轻echarts图表渲染的压力：

处理步骤1：

因为同一个组件做了复用，通过点击事件改变params来区分A组图表和B组图表。一开始推测是切换AB组时数据未清空导致的，所以点击事件时给数据做了重置清空动作(this.list=[];)。这样处理之后，进行测试，结果发现内存在起伏中上涨，最终还是会达到600M而崩溃；

处理步骤2：

到这里考虑是否在某个时机(改变AB组图表时或者什么时候)销毁组件，但是vue的.$destory只能销毁一个实例：清理它与其他实例的链接，解绑它的全部指定以及事件监听，并不会销毁/影响DOM展现。DOM展现还在，就表示前面展现过的图表都还在内存中占用空间。

所以办法就是用v-if强制移除DOM。想到就去尝试，思路是：

给eCharts组件加v-if=“isShow”,isShow通过touch事件触发scrollTop的值变更来决定是否显示；步骤三展开讲具体实现。

处理步骤3：

先说明一下变量/常量

(1)mainPage元素&#x