keep-alive
有時候我們不希望組件被重新渲染影響使用體驗;或者處于性能考慮,避免多次重復渲染降低性能。而是希望組件可以緩存下來,維持當前的狀態。
<!-- 加載路由時將數據保存到內存里,下次不需要再加載 -->
<keep-alive exclude="Detail">
<router-view/>
</keep-alive>
圖片.png
keep-alive的生命周期
- 初次進入時:created > mounted > activated;退出后觸發 deactivated
- 再次進入:會觸發 activated;事件掛載的方法等,只執行一次的放在 mounted 中;組件每次進去執行的方法放在 activated 中
實例:
監聽頁面滾動