如何在vue.js中为动态组件添加道具

How to add props to dynamic component in vue.js?

本文关键字：组件 动态 添加 vue js      更新时间：2023-09-26

我动态创建组件:

<component is="tab"/>

如何为这个组件添加道具?我试着:

<component is="tab" my-props="test" />

And I got error in console: 

[Vue warn]: Attribute "type" is ignored on component <component> because the component is a fragment instance: http://vuejs.org/guide/components.html#Fragment-Instance

注:我使用1.0.26版本vue.js.

如果测试不只是"测试"文本，而是一些值在您的数据。然后你需要像这样传递它:

<component is="tab" :props="test" />

不要忘记在组件的props数组中添加属性。props: ['props'] .

http://jsbin.com/zekiyeroka/edit?html, css, js,控制台输出

这是一个工作示例。添加数据是可选的，但我更喜欢这种方式。因为将来你可以用更简单的方式操作你的数据。

注:您需要在组件中像声明function一样声明data，而不仅仅是object

相关文章：