将道具传递到模板

如何将props传递给markdown/template语法中的组件？将道具传递到模板

我可以做类似React <component :props="myObject">吗？以及我将如何处理我的组件内？道具是否也必须在我的组件中声明，或者我可以拥有“未知”道具吗？

我的直觉，反应的影响，会做：

<template> 
    <div> 
     <component :is="Form" :prop="{title: 'foo', subTitle: 'bar'}"></component> 
    </div> 
</template>

，并在我的Form.vue文件我就不必申报props，想申报数据：

data(){ 
    return {title: '', subTitle: ''}; 
}

来源

2017-04-05 Rikard

他们（道具）已到组件内部声明。 –

另外，如果您使用属性绑定：prop ='some'，您可以在数据属性中使用它。您的问题是否将道具传递给一般组件或将道具传递给动态组件？因为''？ –

@AmreshVenugopal我想将道具动态地传递给一个''，我使用了一个名为'Form'的组件（这是一个提交表单），我想将'props'传递给它，所以我可以添加输入，根据“道具”对象选择按钮。如果我不清楚，请告诉我，来自React世界，对Vue.js非常好奇！ – Rikard

由于每文档：

prop是一个自定义属性，用于从父组件传递信息经济需求。子组件必须明确声明它希望接收使用道具选择道具：

在你的情况，父组件：

<template> 
    <child :title-data="sample_data"></child> 
</template>

可以在父组件设置“SAMPLE_DATA”数据。

data: function() { 
    return { 
    sample_data: { 
     'title': '', 
     'subtitle': '' 
    } 
    } 
}

子组件：

<template> 
    <span> {{ titleData.title }} </span> 
    <span> {{ titleData.subtitle }} </span> 
</template> 

<script> 
export default { 
    name: 'child', 
    props: ['titleData'] 
} 
</script>

是的，你必须声明组件内的道具。你可以用上面的方式声明它，或者你可以更清楚地说明道具从而验证道具。阅读本关于如何去它：https://vuejs.org/v2/guide/components.html#Prop-Validation

也了解烤肉情况VS驼峰道具：https://vuejs.org/v2/guide/components.html#camelCase-vs-kebab-case

了解更多关于道具：https://vuejs.org/v2/guide/components.html#Props

来源

2017-04-05 08:28:44 Deepak

谢谢你看我的问题！我只看到'：title-data'一次，如果不是我在'child'组件中使用的属性名称？ becase'title-data'不是一个具有speciall funcionality的保留字吗？ – Rikard

它是在孩子内部宣称的道具，请参阅道具：['titleData']，看看这个来理解情况的变化：https：//vuejs.org/v2/guide/components.html#camelCase-vs-kebab -case – Deepak

基本上，如果你的prop是'titleData'（camelCase），那么当你在html中使用它作为属性时，它必须被用作'标题数据'（kebab-case）。 – Deepak

将道具传递到模板

回答

相关问题