Vue.js通用动态组件渲染

Question

我有一个组件，可以动态获取作为道具的组件

<template>
    <div>
        <component :is="component" :data="data" v-if="component" />
    </div>
</template>

<script>

export default {
    name: 'dynamic-component-renderer',
    props: ['data', 'type'],
    computed: {
        component() {
            if (!this.type) {
                return null;
            }
            return this.type;
        },
    }
}
</script>

问题在于导入，我需要动态导入，我知道我可以使用webpack进行动态导入，例如：() => import('./my-async-component'），但就我而言，我不需要lazyLoad。

因此，我需要一个通用的虚拟组件（dynamic-component-renderer），该组件不会知道将获取哪些组件并进行动态渲染。