const modules =import.meta.glob('./components-new/*.vue');const components:any=ref({});
Object.entries(modules).forEach(([path, asyncCom])=>{const name = path.replace(/\.\/components-new\/(.*)\.vue/,'$1');
components.value[name]=markRaw(defineAsyncComponent(asyncCom));});
动态使用组件
<divv-for="(item, index) in componentList":key="index"class="wow"><templatev-if="item.show"><component:is="components[item.name]"></component></template></div>
控制组件显隐与顺序
constcomponentList: any =ref([{name:'comp1',show:false},{name:'comp2',show:false},{name:'comp3',show:false},{name:'comp4',show:false},{name:'comp5',show:false},{name:'comp6',show:false},{name:'comp7',show:false},]);