テンプレートに小道具を渡す

Question

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: ''}; 
} 

Answer 1

ドキュメント：

propは、親コンポーネントから情報を渡すためのカスタム属性ですents。あなたが親コンポーネントに「SAMPLE_DATA」にデータを設定することができます

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

：親コンポーネント、あなたのケースでは

：子コンポーネントは、明示的にそれは小道具のオプションを使用して受信することを期待小道具を宣言する必要があります。

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

また小道具でキャメルケース対ケバブ・ケースについて読む：それについて移動する方法については、これを読んでhttps://vuejs.org/v2/guide/components.html#camelCase-vs-kebab-case

小道具について詳しく読む：https://vuejs.org/v2/guide/components.html#Props