javascript - 如何通过 props 传递导入的组件？

Question

有没有办法可以通过 props 将组件从父组件传递给子组件，而不必从子组件导入它？

父组件:

<template>
  <ChildComponent :component="componentName">
</template>
<script>
  import componentName from '@/components/componentName.vue'
</script>

子组件:

<template>
   <div>
      <component :is="component">
   </div>
</template>
<script>
  props: {
    component: Object
  }
</script>

目前，在此设置中，我收到未知的自定义事件您是否正确注册了组件？错误。我知道它希望我在子组件中注册该组件，但我不想从子组件中导入该组件。有没有办法通过 props 将导入传递给 child ？这不可能吗？

Answer 1

你真的很接近，问题出在你的第一个模板中:

<template>
  <ChildComponent :component="componentName">
</template>
<script>
  // this is not available in template scope
  import componentName from '@/components/componentName.vue'

  export default {
    data: {
      // this, however, is available!
      componentName
    }
  }
</script>