Vue組件緩存 keep-alive

是Vue的內(nèi)置組件，能在組件切換過程中將狀態(tài)保留在內(nèi)存中，防止重復(fù)渲染DOM（防止重新發(fā)請求）。

包裹動(dòng)態(tài)組件時(shí)，會緩存不活動(dòng)的組件實(shí)例，而不是銷毀它們。和 相似， 是一個(gè)抽象組件：它自身不會渲染一個(gè) DOM 元素，也不會出現(xiàn)在父組件鏈中。

全部緩存

直接在App.vue里面的路由占位符外層包裹一個(gè) keep-alive標(biāo)簽即可

結(jié)合router，緩存部分頁面

通常就是需要緩存部分需要緩存的組件或頁面

使用$route.meta的keepAlive屬性

1. 先在router.js中設(shè)置router的元信息meta：

2. 然后再App.vue里面對路由占位符做個(gè)if判斷，就是獲取meta里面的keepalive的值，true就需要緩存，否則不緩存。這里同樣還要寫上不需要緩存的組件的占位符，如果不寫，不需要緩存的組件就不顯示了：