十四、Vue專案 - 對全域性事件的解綁(非常重要 !!!)
問題:
上一篇是在詳情頁的Header.vue元件中做的漸隱漸現效果中用到了window.addEventListener(‘scroll’, this.handleScroll)
但沒有及時對全域性事件進行解綁,就會對程式碼造成大量bug。
現在去首頁滑動也能執行,這是因為window是對全域性物件進行繫結,並不是繫結在元件中
解決:
當我們對元件用了keep-alive之後就會多出一個 deactivated() 生命週期鉤子函式:頁面即將被隱藏或即將被替換成新的頁面時執行
相關文章
- vue專案如何全域性引入scss檔案VueCSS
- 刪除事件(解綁事件)/ 刪除事件相容性解決方案事件
- vue專案中如何全域性引入scss/sass檔案VueCSS
- Vue專案全域性配置微信分享實踐Vue
- webpack+vue+sass專案中,sass提取全域性引用WebVue
- Vue 原始碼解讀(5)—— 全域性 APIVue原始碼API
- jQuery之_事件繫結與解綁jQuery事件
- vue定義全域性變數和全域性方法Vue變數
- Vue專案全域性配置頁面快取,實現按需讀取快取Vue快取
- [Vue] 如何定義全域性的方法?Vue
- vue2.0全域性路由守衛(全域性控制登入)Vue路由
- nodejs在typescript專案中申明全域性變數NodeJSTypeScript變數
- Vue -- vue-全域性導航守衛Vue
- webpack4對第三方庫css,專案全域性css和vue內聯css檔案提取到單獨的檔案(二十二)WebCSSVue
- Vue元件之全域性註冊Vue元件
- React專案實現全域性 loading 以及錯誤提示React
- 五分鐘一百行程式碼,手寫一個vue專案全域性通用的toast提示元件行程VueAST元件
- vue 原始碼詳解(一):原型物件和全域性 `API`的設計Vue原始碼原型物件API
- 兩種方式配置vue全域性方法Vue
- vue.js中封裝全域性filterVue.js封裝Filter
- 基於Vue的點對點聊天專案Vue
- 聊聊springboot專案全域性異常處理那些事兒Spring Boot
- 基於NuxtJS/Vue自定義彈層元件|Vue長按彈窗|Vue全域性對話方塊UXJSVue元件
- vue-geventbus – 一個優雅的 Vue 全域性事件處理外掛Vue事件
- vue-geventbus - 一個優雅的 Vue 全域性事件處理外掛Vue事件
- 手撕Vue-Router-新增全域性$router屬性Vue
- vue專案中解決type=”file“ change事件只執行一次的問題Vue事件
- vue 全域性函式的 定義與任意呼叫Vue函式
- Spring Security原始碼分析十四:Spring Social社交登入繫結與解綁Spring原始碼
- Vue定義全域性過濾器filterVue過濾器Filter
- vue-cli4中全域性引入jqueryVuejQuery
- 手把手教你擼vue全域性元件Vue元件
- vue-cli 配置 sass 全域性變數Vue變數
- vue 專案白屏解決方案Vue
- 在vue專案中自定義事件匯流排eventHubVue事件
- 深入淺出的webpack構建工具--webpack4+vue+router專案架構(十四)WebVue架構
- Vue註冊的全域性元件配置物件儲存的位置Vue元件物件
- nuxt3專案自定義環境變數,typescript全域性提示UX變數TypeScript