vue3中动态引入组件并渲染组件

在开发中 有时会在打包或者各种可能的情况下 报错或警告提示 模块化打包的问题，
我们需要动态引入组件并渲染组件时，可以使用import引入 如下举例

import { ref, markRaw } from 'vue'
const childrenComponent = ref();
onMounted(() => {//举例引入一个组件childrenComponent.vueimport('**/..**../childrenComponent.vue').then((module) => {childrenComponent.value = markRaw(module.default);// 确保该赋值操作不会反复触发重新渲染});
});

可以使用component标签和:is 属性来动态创建和使用组件。

  <component :is="childrenComponent" v-if=" childrenComponent"/>