vue專案開發裡，必不可少都會遇到父元件向子元件傳值，下面具體說明一下父元件向子元件傳值的步驟：

一、首先需要兩個vue頁面，這裡分別新建father.vue（父元件），subComponents.vue（子元件）。

二、值肯定是定義在父元件中的，供所有子元件共享。所以要在父元件（father.vue）的data中定義值：

三、父元件要和子元件有契合點：就是在父元件中呼叫、註冊、引用子元件：

四、在父級頁面引用子元件的標籤上，把父元件的值繫結給子元件：

這裡我綁定了兩個值，字串和陣列。
五、子元件內部去接受父元件傳過來的值：props 來接收：

子元件通過props來接收資料:
方式1：
props: [‘childMsg’]

方式2 :
props: {
childMsg: Array //這樣可以指定傳入的型別，如果型別不對，會警告
}

方式3：
props: {
childMsg: {
type: Array, //傳入的型別
default: [0,0,0] //這樣可以指定預設的值
}
}

六、完成，子元件內部就可以直接使用父元件的值啦！

總結：
父傳子主要三個步驟——
1、父元件中定義值，呼叫子元件、註冊、並在引用的標籤上給子元件傳值；
2、在子元件內進行props接收；
3、將props接收到的值在所需地點進行顯示。

注意：是要用 v-bind: 繫結要傳的值，不用v-bind直接把值放到標籤上，否則會被當成html的節點屬性解析。