vue3动态组件,涉及了＜component :is=“...“＞的使用

动态组件​
有些场景会需要在两个组件间来回切换，比如 Tab 界面：



上面的例子是通过 Vue 的 <component> 元素和特殊的 is attribute 实现的：


<!-- currentTab 改变时组件也改变 -->
<component :is="tabs[currentTab]"></component>
在上面的例子中，被传给 :is 的值可以是以下几种：

被注册的组件名
导入的组件对象
你也可以使用 is attribute 来创建一般的 HTML 元素。

当使用 <component :is="..."> 来在多个组件间作切换时，被切换掉的组件会被卸载。我们可以通过 <KeepAlive> 组件强制被切换掉的组件仍然保持“存活”的状态。

原文:

组件基础 | Vue.js动态组件