vue3 typescript组件缓存(keep-alive)失效问题

在vue3中，使用javascript作为开发语言，利用keep-alive的include属性动态缓存组件，以达到标签页切换时缓存组件，关闭标签页时清除缓存的目的，如下代码所示：

<script setup>
const cacheNamesList = ref<string[]>([]);//保存需要缓存的组件名称列表
</script>
……
<router-view v-slot="{ Component }">
  <keep-alive :include="cacheNamesList">
    <component :is="Component"/>
  </keep-alive>
 </router-view>

在组件中命名组件的方式：使用setup语法糖的时候在<script>标签中增加name属性，如下所示：

<script setup name="Welcome"> <!-- 命名组件 -->
</script>

但是在使用typescript作为开发语言时，不能采用这样的方式命名组件，需要使用多个<script>标签，如下所示：

<script setup lang="ts">
//setup语法糖代码
</script>
<script lang="ts">
export default {
  name: "Welcome" //命名组件
}
</script>