所有的 prop 都使得其父子 prop 之間形成了一個單向下行綁定：父級 prop 的更新會向下流動到子組件中，但是反過來則不行辜腺。
一休建、父組件向子組件傳參柱锹，
1.先將要prop傳遞的數(shù)據(jù)綁定在子組件在父組件中的實例里。
2.然后子組件里設置props進行數(shù)據(jù)接受丰包，
3.并通過文本插值放入組件中。
【父組件】
<template>
<div>
我是父組件,姓{{firstName}}
<son :firstName="firstName"></son> //綁定要傳遞給子組件的參數(shù)
</div>
</template>
<script>
import Son from '../components/son'
export default {
components: {
Son}, //引入子組件
data () {
return {
firstName: '張'}}} //原信息
</script>
【子組件】
<template>
<div>我是子組件,我姓{{firstName}}</div> //插值
</template>
<script>
export default {
props: { //接收父組件傳來的數(shù)據(jù)壤巷，并指定類型
firstName: {
type: String,
required: true
}},}
</script>
二邑彪、注意：子組件中v:bind綁定的都是表達式而不是字符串。
<!-- 這是一個 JavaScript 表達式而不是一個字符串胧华。-->
<blog-post v-bind:comment-ids="[234, 266, 273]"></blog-post>
<!-- 這是一個 JavaScript 表達式而不是一個字符串寄症。-->
<blog-post v-bind:author="{ name: 'Veronica', company: 'Veridian Dynamics' }"></blog-post>
三、prop一次傳對象的多個值
如果想將一個對象的所有屬性都作為prop傳入矩动，可以使用不帶參數(shù)的v-bind有巧。例如
<blog-post v-bind="post"></blog-post>
等價于
<blog-post
v-bind:id="post.id"
v-bind:title="post.title"
></blog-post>
四、子組件改變prop值
有兩種常見情況悲没，子組件試圖改變一個prop的情形篮迎。
1、這個prop用來傳遞一個初始值示姿，這個子組件接下來希望將其作為一個本地的prop數(shù)據(jù)來使用甜橱。這種情況，最好定義一個本地的data屬性并將其這個prop用作其初始值栈戳。
props: ['initialCounter'],
data: () {
return {
counter: this.initialCounter
}
}
2岂傲、這個prop以一種原始的值傳入且需要進行轉換。這種情況下子檀，最好使用這個prop的值來定義一個計算屬性镊掖。
props: ['size'],
computed: {
normalizedSize: function () {
return this.size.trim().toLowerCase()
}
}
注意在 JavaScript 中對象和數(shù)組是通過引用傳入的，所以對于一個數(shù)組或對象類型的 prop 來說褂痰，在子組件中改變這個對象或數(shù)組本身將會影響到父組件的狀態(tài)亩进。
五、Prop驗證
export default{
data(){
},
props:{
propA:{
type : String,
required : true, //表示必填
default : "abc" , //默認值
或 default : function(){
return { message : "hello" } //對象或數(shù)組且一定會從一個工廠函數(shù)返回默認值
},
propF{
validator:function(value){
//這個值必須匹配下列字符串中的一個
return ['success','warning','danger'].indexof(value) !== -1
}
}
}
}
}
注意那些 prop 會在一個組件實例創(chuàng)建之前進行驗證缩歪，所以實例的屬性 (如 data镐侯、computed 等) 在 default 或 validator 函數(shù)中是不可用的。???
type 可以是原生構造函數(shù)中的一個：String驶冒、Number苟翻、Boolean 、Array骗污、Object崇猫、Date、Function需忿、Symbol诅炉。也可以是一個自定義的構造函數(shù)蜡歹。
