vue keep-alive 导致setup 执行两次 怎么办

Vue 3 中的 `setup` 函数执行两次的原因可能是因为 `keep-alive` 组件在缓存和激活组件时都会重新创建组件实例，这导致了 `setup` 函数被调用了两次。

为了解决这个问题，您可以在 `setup` 函数中使用 `onActivated` 和 `onDeactivated` 钩子函数，这些钩子函数只在组件被激活和停用时执行一次，而不是每次重新创建组件实例时都执行。例如：

<template>
  <keep-alive>
    <component :is="currentComponent" />
  </keep-alive>
</template>

<script>
import ComponentA from './ComponentA.vue'
import ComponentB from './ComponentB.vue'

export default {
  components: {
    ComponentA,
    ComponentB
  },
  setup() {
    const currentComponent = ref('ComponentA')

    onActivated(() => {
      console.log('Component activated')
    })

    onDeactivated(() => {
      console.log('Component deactivated')
    })

    return {
      currentComponent
    }
  }
}
</script>

在上面的代码中，我们使用了 `onActivated` 和 `onDeactivated` 钩子函数来处理组件被激活和停用的事件，并且将当前组件的名称存储在 `currentComponent` 变量中。这样就避免了 `setup` 函数被重复执行的问题。