问题：为什么vue3需要对引入的组件使用markrow？
<template>
<div>
<component :is="A"></component>
</div>
</template>
<script>
import A from './A';
export default {
name: 'Home',
data() {
return {}
},
components: { A },
}<template>
<ul>
<li
v-for='(item,index) in tabList'
:key='index'
@click='change(index)'
>
{{ item.name }}
</li>
</ul>
<keep-alive>
<component :is="currentComponent"></component>
</keep-alive>
</template>
<script setup>
import A from '../components/A.vue'
import B from '../components/B.vue'
import C from '../components/C.vue'
let tabList = reactive([
{name:'组件A',com:markRaw(A)},
{name:'组件B',com:markRaw(B)},
{name:'组件C',com:markRaw(C)}
]);
let currentComponent = reactive({
com:tabList[0]
});
const change = ( idx )=>{
currentComponent = tabList[idx].com;
}以上就是vue3动态组件如何使用的详细内容，更多请关注php中文网其它相关文章！
每个人都需要一台速度更快、更稳定的 PC。随着时间的推移，垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是，许多工具可以让 Windows 保持平稳运行。
Copyright 2014-2025 //m.sbmmt.com/ All Rights Reserved | php.cn | 湘ICP备2023035733号
163
收藏
