1、v-show，v-if 用哪個？
在我來看要分兩個維度去思考問題：
第一個維度是權限問題，只要涉及到權限相關的展示無疑要用 v-if，
第二個維度在沒有權限限制下根據用戶點擊的頻次選擇，頻繁切換的使用 v-show，不頻繁切換的使用 v-if，
這里要說的優化點在於減少頁面中 dom 總數，我比較傾向於使用 v-if，因為減少了 dom 數量，加快首屏渲染，至於性能方面我感覺肉眼看不出來切換的渲染過程，也不會影響用戶的體驗。
2、不要在模板里面寫過多的表達式與判斷
v-if="isShow && isAdmin && (a || b)"，這種表達式雖說可以識別，但是不是長久之計，當看着不舒服時，
適當的寫到 methods 和 computed 里面封裝成一個方法，這樣的好處是方便我們在多處判斷相同的表達式，其他權限相同的元素再判斷展示的時候調用同一個方法即可。
3、循環調用子組件時添加 key
key 可以唯一標識一個循環個體，可以使用例如 item.id 作為 key，
假如數組數據是這樣的 ['a' , 'b', 'c', 'a'],使用 :key="item" 顯然沒有意義，更好的辦法就是在循環的時候 (item, index) in arr，然后 :key="index"來確保 key 的唯一性
當 Vue.js 用v-for 正在更新已渲染過的元素列表時，它默認用“就地復用”策略。如果數據項的順序被改變，Vue 將不會移動 DOM 元素來匹配數據項的順序， 而是簡單復用此處每個元素，並且確保它在特定索引下顯示已被渲染過的每個元素。為了給 Vue 一個提示，以便它能跟蹤每個節點的身份，從而重用和重新排序現有元素，你需要為每項提供一個唯一 key 屬性。理想的 key 值是每項都有的且唯一的 id。這個特殊的屬性相當於 Vue 1.x 的 track-by ，但它的工作方式類似於一個屬性，所以你需要用 v-bind 來綁定動態值 (在這里使用簡寫)：
4、對路由組件進行懶加載
這里的懶加載是指在訪問到對應的組件時才加載它，首屏的時候不加載。這里實現的方法很簡單，只要將以前直接import組件的方式改為：
const Login = () => import('@/pages/Login’);即可。