# keep-alive遇見vue-router
## `keep-alive`
是 Vue 內置的一個組件,可以使被包含的組件保留狀態,或避免重新渲染。
## 它們有兩個非常重要的屬性:
`include`\- 字符串或正則表達,只有匹配的組件會被緩存
`exclude`\- 字符串或正則表達式,任何匹配的組件都不會被緩存
`max`\- 數字。最多可以緩存多少組件實例。
## 使用
router-view 也是一個組件,如果直接被包在 keep-alive 里面,所有路徑匹配到的視圖組件都會被緩存:
```
<!-- 逗號分隔字符串 -->
<keep-alive include="a,b">
<router-view>
<!---------所有路徑匹配到的視圖組件都會被緩存--------------->
</router-view>
</keep-alive>
```
```
<!-- 數組 (使用 `v-bind`) -->
<keep-alive :include="['a', 'b']">
<router-view>
<!---------所有路徑匹配到的視圖組件都會被緩存--------------->
</router-view>
</keep-alive>
```