在使用伺服器端渲染時，除了服務端的介面快取、頁面快取、組建快取等，瀏覽器端也避免不了要使用快取，減少頁面的重繪。

這時候我們就會想到vue的keep-alive，接下來我們說一下keep-alive的使用

假如現在我們有兩個頁面，home.vue 和 about.vue

home.vue

<template>
      <div>
        home
    </div>
</template>  
<script>
    export default {
        name: Home,
        created() {
            console.log('home)
        }
    }    
</script>      

 about.vue　　

<template>
      <div>
        about
    </div>
</template>  
<script>
    export default {
        name: About,
        created() {
            console.log('home)
        }
    }    
</script>      

在app.vue中我們使用keep-alive快取

<template>
  <div id="app">
    <keep-alive include="Home">
      <router-view class="view">
      </router-view>
    </keep-alive>
  </div>
</template>

<script>
export default {
  name: 'App'
}
</script>

這時候執行我們會發現Home頁面就快取下來了，大功告成