Vue3 中为什么用 div 包裹 keep-alive 会导致缓存失效

在 Vue 3 中，由于 keep-alive 已成为内置组件，不再需要包裹在一个 div 中。实际上，包裹在 div 中会导致缓存失效，因为 div 会被认为是 keep-alive 的一个子节点，每次切换时都会重新渲染。

因此，可以直接将 keep-alive 放在组件的 template 标签中，例如：

<template>
  <keep-alive include='page01,page04,page05'>
    <component :is='Component' :key='$route.name'></component>
  </keep-alive>
</template>

这样可以确保 keep-alive 正常工作并缓存组件。