vue:內(nèi)存泄露詳解
更新時(shí)間：2021年10月09日 16:38:29 作者：閑敲代碼賺花花
這篇文章主要介紹了一個(gè)Vue的內(nèi)存泄露詳解，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
什么是內(nèi)存泄露？內(nèi)存泄露是指new了一塊內(nèi)存，但無法被釋放或者被垃圾回收。new了一個(gè)對象之后 ，它申請占用了一塊堆內(nèi)存，當(dāng)把這個(gè)對象指針置為null時(shí)或者離開作用域?qū)е卤讳N毀，那么這塊內(nèi) 存沒有人引用它了在JS里面就會(huì)被自動(dòng)垃圾回收。但是如果這個(gè)對象指針沒有被置為null，且代碼面 沒辦法再獲取到這個(gè)對象指針了，就會(huì)導(dǎo)致無法釋放掉它指向的內(nèi)存，也就是說發(fā)生了內(nèi)存泄露。 內(nèi)存泄漏（Memory Leak）是指程序中已動(dòng)態(tài)分配的堆內(nèi)存由于某種原因程序未釋放或無法釋放，造 成系統(tǒng)內(nèi)存的浪費(fèi)，導(dǎo)致程序運(yùn)行速度減慢甚至系統(tǒng)崩潰等嚴(yán)重后果。 1、echarts圖未徹底刪除； 2、setTimeout和setInterval未清除； 3、全局定于變量未清除； 4、偵聽器未清除
場景分析
其中全局對象onresize，偵聽事件應(yīng)在組價(jià)銷毀前清除。
重點(diǎn)：在vue中，echarts繪圖是十分消耗資源的，所以在組件銷毀前，一定要清除對應(yīng)的數(shù)據(jù)。
在data中定義如下：
在銷毀組件前，應(yīng)進(jìn)行如下操作：
vue中1
vue中2
3keep-alive
一旦你使用了 keep-alive，那么你就可以訪問另外兩個(gè)生命周期鉤子：activated和 deactivated。如果你想要在一個(gè) keep-alive 組件被移除的時(shí)候進(jìn)行清理或改變數(shù)據(jù)，可以使用 deactivated 鉤子。
deactivated: function () {
// 移除任何你不想保留的數(shù)據(jù)，或者銷毀可能產(chǎn)生內(nèi)存泄漏的地方
}
總結(jié)
本篇文章就到這里了，希望能夠給你帶來幫助，也希望您能夠多多關(guān)注腳本之家的更多內(nèi)容！
相關(guān)文章
vue實(shí)現(xiàn)一拉到底的滑動(dòng)驗(yàn)證
這篇文章主要為大家詳細(xì)介紹了vue簡單的一拉到底的滑動(dòng)驗(yàn)證，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-07-07
本篇文章主要介紹了web前端vue之CSS過渡效果示例，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-01-01
Vue使用pdf-lib實(shí)現(xiàn)為文件流添加水印并預(yù)覽
這篇文章主要為大家詳細(xì)介紹了Vue如何使用pdf-lib實(shí)現(xiàn)為文件流添加水印并預(yù)覽的功能，文中的示例代碼講解詳細(xì)，感興趣的小伙伴可以跟隨小編一起了解一下2023-03-03
Vue3中使用qrcode庫實(shí)現(xiàn)二維碼生成
Vue3中實(shí)現(xiàn)二維碼生成需要使用第三方庫來處理生成二維碼的邏輯,常用的庫有?qrcode和?vue-qrcode,本文主要介紹了Vue3中使用qrcode庫實(shí)現(xiàn)二維碼生成,感興趣的可以了解一下2023-12-12
這篇文章主要介紹了Vue 使用中的小技巧,是小編日常開發(fā)的時(shí)候用到的小技巧，需要的朋友可以參考下2018-04-04
這篇文章主要介紹了vue框架render方法如何替換template，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-04-04
這篇文章主要介紹了Vue使用Proxy代理后仍無法生效的解決，具有很好的參考價(jià)值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-11-11
Vue批量注冊組件實(shí)現(xiàn)動(dòng)態(tài)組件技巧
Vue 動(dòng)態(tài)組件的應(yīng)用場景很多,可應(yīng)用于動(dòng)態(tài)頁簽,動(dòng)態(tài)路由等場景,其核心原理是批量注冊,在Vue2和Vue3中實(shí)現(xiàn)原理相同,只是語法略有差異,本文給大家介紹了Vue批量注冊組件實(shí)現(xiàn)動(dòng)態(tài)組件技巧,需要的朋友可以參考下2024-11-11
有時(shí)，你可能希望將任意信息附加到路由上，如過渡名稱、誰可以訪問路由等。這些事情可以通過接收屬性對象的meta屬性來實(shí)現(xiàn)，并且它可以在路由地址和導(dǎo)航守衛(wèi)上都被訪問到2022-09-09
vue3+vant4實(shí)現(xiàn)pdf文件上傳與預(yù)覽組件
這篇文章主要介紹了vue3如何結(jié)合vant4實(shí)現(xiàn)簡單的pdf文件上傳與預(yù)覽組件,文中的示例代碼講解詳細(xì),感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2025-04-04