為列表渲染設定屬性key
在v-if/v-if-else/v-else中使用key
如果一組v-if+v-else的元素型別相同,最好使用屬性key(比如兩個元素)
路由切換元件不變
使用vue.js時,頁面切換到同乙個路由但不同引數的位址時,元件的生命週期鉤子並不會重新觸發
例:const routes = [ ]
當路由從/detail/1切換到/detail/2時,元件是不會發生任何變化的。
這是因為vue-router會識別出兩個路由使用的是同乙個元件從而進行復用,並不會重新建立元件,
因此元件的生命週期鉤子自然也不會被觸發。
解決這個問題的三個方法:
路由導航守衛beforerouteupdate (最推薦)
只需把每次切換路由時需要執行的邏輯放到beforerouteupdate守衛中即可。
觀察$route物件的變化
簡單粗暴,但非常浪費效能
為router-view元件新增屬性key
為所有路由統一新增query
使用全域性守衛beforeeach
使用函式劫持
區分vuex與props的使用邊界
避免v-if和v-for一起使用
為了過濾乙個列表中的專案,比如v-for='user in users' v-if='user.isactive',
請將users替換為乙個計算數屬性,比如activeusers,讓他犯規或呂后的列表
為了避免渲染本應該被隱藏的列表。
其它省略...
Vue最佳實踐
vue 最佳實踐,是參考 vue 官方風格指南並根據過去 vue 實際專案開發中的經驗總結的一套規範建議。本專案的目的是希望每個 vue 開發者都能盡快熟悉並上手專案 志在幫助 vue 新手開發者及時避免一些不規範的設計和由此而引發的問題。本建議如有不妥之處,敬請指正!非常歡迎有志同道合的開發者貢獻...
Vue最佳實踐文章學習
注 在元件被銷毀的時候,destoryed鉤子中,對 on 繫結的事件,off進行清除,防止記憶體洩露 使用場景 在元件初始化和屬性更新的時候觸發同乙個方法 watch created methods 可以將所有的功能都放在watch裡,避免 重複,並且在初始化時也會觸發 watch methods...
最佳實踐 Flutter 最佳實踐
最佳實踐是乙個領域可以接受的專業標準,對於任何程式語言來說,提高 質量 可讀性 可維護性和健壯性都非常重要。讓我們探索一些設計和開發flutter應用程式的最佳實踐。class enum typedef和extension應採用駝峰命名uppercamelcase規則。class mainscree...