vue项目中遇到(Maximum call stack size exceeded)错误的处理
发现问题:近期公司要求用vue组件化开发一个管理后台,项目中用到了天地图的绘制功能,这部分产出了许多对象实例,单个组件往里面导入大量数据的时候(部分对象存在上万个数据),发生了内存溢出的错误。分析问题:从报错信息可以看出是地图相关数据造成的,而根据需求这部分数据在当前组件中是不需要展示的,而我写的代码是把这些数据存在了data中,众所周知vue的响应式处理会产生大量的setter和gette...
·
发现问题:
近期公司要求用vue组件化开发一个管理后台,项目中用到了天地图的绘制功能,这部分产出了许多对象实例,单个组件往里面导入大量数据的时候(部分对象存在上万个数据),发生了内存溢出的错误。
分析问题:
从报错信息可以看出是地图相关数据造成的,而根据需求这部分数据在当前组件中是不需要展示的,而我写的代码是把这些数据存在了data中,众所周知vue的响应式处理会产生大量的setter和getter,主要是讲视图需要的数据和地图数据糅合在了一起,因此想把地图的数据单独设置成非响应式的。
解决问题
由于vue的响应式处理都是通过Object.defineProperty()处理的,于是从这方面入手,将地图的数据设置成configurable设置成false。再次导入发现问题解决啦。事实上与渲染无关的数据都尽量不要写在data里面。
更多推荐
已为社区贡献1条内容
所有评论(0)