javascript – 是否可以将组件作为道具传递并在Vue中的子组件中使用它？

在Vue 2.0应用程序中,假设我们有组件A,B和C.

声明,注册和使用B.

是否有可能将C从A传递给B？

像这样的东西：

<template>
  <div class="A">
    <B :child_component="C" />
  </div>
</template>

并以某种方式在B中使用C.

<template>
  <div class="B">
    <C>Something else</C>
  </div>
</template>

动机：我想创建一个在A中使用但从A接收其子C的通用组件B.实际上A将使用B多次将不同的’C’传递给它.

如果这种方法不正确,在Vue中这样做的正确方法是什么？

回答@Saurabh

而不是作为道具传递,我尝试了B.内部的建议.

<!-- this is where I Call the dynamic component in B -->

<component :is="child_component"></component>

//this is what I did in B js
components: {
 equip: Equipment
}, 
data () {
 return {
   child_component: 'equip',
   _list: []
 }
}

基本上我试图渲染设备,但动态的方式

我在控制台和空白页面中收到3个错误

[Vue warn]: Error when rendering component at /home/victor/projetos/tokaai/public/src/components/EquipmentFormItem.vue:

Uncaught TypeError: Cannot read property ‘name’ of undefined

TypeError: Cannot read property ‘setAttribute’ of undefined

显然我做错了什么

解决方法:

你可以使用特殊属性来做这种事情.动态组件的示例及其用法可以在here找到.

You can use the same mount point and dynamically switch between multiple components using the reserved element and dynamically bind to its is attribute:

您的代码如下所示：

<template>
  <div class="B">
    <component :is="child_component"> Something else</component>
  </div>
</template>

标签：javascript,vue-js,vue-component,vuejs2
来源： https://codeday.me/bug/20190930/1835250.html