vue:內(nèi)存泄露詳解
更新時間：2021年10月09日 16:38:29 作者：閑敲代碼賺花花
這篇文章主要介紹了一個Vue的內(nèi)存泄露詳解，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
什么是內(nèi)存泄露？內(nèi)存泄露是指new了一塊內(nèi)存，但無法被釋放或者被垃圾回收。new了一個對象之后 ，它申請占用了一塊堆內(nèi)存，當把這個對象指針置為null時或者離開作用域?qū)е卤讳N毀，那么這塊內(nèi) 存沒有人引用它了在JS里面就會被自動垃圾回收。但是如果這個對象指針沒有被置為null，且代碼面 沒辦法再獲取到這個對象指針了，就會導致無法釋放掉它指向的內(nèi)存，也就是說發(fā)生了內(nèi)存泄露。 內(nèi)存泄漏（Memory Leak）是指程序中已動態(tài)分配的堆內(nèi)存由于某種原因程序未釋放或無法釋放，造 成系統(tǒng)內(nèi)存的浪費，導致程序運行速度減慢甚至系統(tǒng)崩潰等嚴重后果。 1、echarts圖未徹底刪除； 2、setTimeout和setInterval未清除； 3、全局定于變量未清除； 4、偵聽器未清除
場景分析
其中全局對象onresize，偵聽事件應(yīng)在組價銷毀前清除。
重點：在vue中，echarts繪圖是十分消耗資源的，所以在組件銷毀前，一定要清除對應(yīng)的數(shù)據(jù)。
在data中定義如下：
在銷毀組件前，應(yīng)進行如下操作：
vue中1
vue中2
3keep-alive
一旦你使用了 keep-alive，那么你就可以訪問另外兩個生命周期鉤子：activated和 deactivated。如果你想要在一個 keep-alive 組件被移除的時候進行清理或改變數(shù)據(jù)，可以使用 deactivated 鉤子。
deactivated: function () {
// 移除任何你不想保留的數(shù)據(jù)，或者銷毀可能產(chǎn)生內(nèi)存泄漏的地方
}
總結(jié)
本篇文章就到這里了，希望能夠給你帶來幫助，也希望您能夠多多關(guān)注腳本之家的更多內(nèi)容！
相關(guān)文章
這篇文章主要為大家詳細介紹了Vue實現(xiàn)日歷小插件，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2019-06-06
這篇文章主要為大家詳細介紹了vue實現(xiàn)目錄樹結(jié)構(gòu)，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-03-03
路由導航守衛(wèi)提供了一些鉤子函數(shù),可以在路由導航過程中進行攔截和控制,其中,beforeEach 導航守衛(wèi)可以在每次路由切換前被觸發(fā),本文給大家介紹Vue路由守衛(wèi)詳解,感興趣的朋友一起看看吧2023-10-10
下面小編就為大家分享一篇vue注冊組件的幾種方式總結(jié)，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-03-03
這篇文章主要介紹了vue中如何將日期轉(zhuǎn)換為指定的格式，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-10-10
antd?Vue實現(xiàn)Login登錄頁面布局案例詳解?附帶驗證碼驗證功能
這篇文章主要介紹了antd?Vue實現(xiàn)Login登錄頁面布局案例詳解附帶驗證碼驗證功能,本文通過實例代碼給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值，需要的朋友可以參考下2022-05-05
Vue3+TypeScript埋點方面的應(yīng)用實踐
本文詳細闡述了如何在Vue3中使用TypeScript實現(xiàn)埋點功能,包括全局注冊$track插件、Mixin實現(xiàn)全局埋點等,隨著Vue3的逐漸普及,在實際工作中采用Vue3+TypeScript實現(xiàn)埋點將會變得越來越流行2023-08-08
這篇文章主要介紹了Vue和Bootstrap的整合思路詳解,需要的朋友可以參考下2017-06-06
vue中阻止click事件冒泡,防止觸發(fā)另一個事件的方法
下面小編就為大家分享一篇vue中阻止click事件冒泡,防止觸發(fā)另一個事件的方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-02-02
這篇文章主要介紹了Vue基本指令實例圖文講解，文章將基本指令講解的很清楚，有對于指令不太懂的同學可以跟著學習研究下2021-02-02