切换路由时VueJS内存泄漏

use*_*888 6 javascript memory-leaks vue.js vue-router vuex

每当我切换路线时,我注意到我的应用程序中的Vue组件永远不会被破坏,只会被创建(当我在路线之间切换时,#Deleted列始终为0)。更明确地说,创建的新组件数始终等于该路线上显示的组件数,即,当重新访问路线时,不会销毁任何Vue组件,并且会重新创建该路线上的每个组件。

在此处输入图片说明

我一直在研究调试问题,并且我知道以下通常是VueJS中内存泄漏的元凶。

  • 使用全局事件总线以及无法注销回调。这在这里清楚地详细说明。虽然在应用程序的某些区域中确实使用了全局事件总线,但是我也没有在全局事件总线上创建任何事件侦听器的页面上遇到内存泄漏,这使我相信这不是问题所在这里。
  • 使用第3方库时无法手动清理内存,这是VueJS文档概述的问题。同样,我一直在不使用第三方库的页面上查看内存使用情况,但仍在这些页面上遇到内存泄漏。

我遇到的另一个潜在问题是我不太了解。在这个github线程中,OP关于VueJS中内存泄漏的潜在原因说了以下几点:

所以我确保我不会做任何愚蠢的事情,例如在Vuex商店中存储对此的引用...

有人可以解释一下OP对Vuex和内存泄漏的含义吗?

此外,还有哪些其他潜在问题导致我遗漏的VueJS中的内存泄漏可能会影响我的应用程序?

除了使用Chrome devtools中的“内存”标签以外,我还应该如何调试内存泄漏?

yea*_*xon 1

调试内存实在是太痛苦了,而且你的日志看起来和我的非常相似。

我发现要小心你的日志:console.log(vuecompoent) 实际上将你的组件存储在内存中并且不会释放它。

另请考虑我也关闭了 vue 开发工具,但我不确定这是否导致了问题。

查看固定器部分。这可能会给您一些见解。