JAVASCRIPT

vue 3 script setup dynamic component sample

<template>
  <button @click="changeTab(CompB)">
    Change
  </button>
  <component :is="tab"></component>
</template>

<script setup>
import CompA from './CompA.vue'
import CompB from './CompB.vue'
import { ref, markRaw } from 'vue'

const tab = ref(null)

changeTab(CompA)
function changeTab (comp) {
  tab.value = markRaw(comp)
}
</script>