轉自：https://www.cnblogs.com/goloving/p/8660407.html

當在一個組件中，使用了其他自定義組件時，就會利用子組件的屬性和事件來和父組件進行數據交流。

父子組件之間的通信就是 props down,? ?events up，父組件通過 屬性props向下傳遞數據給子組件，子組件通過事件 events 給父組件發送消息。

子組件需要某個數據時，就在內部定義一個prop屬性，父組件就像給HTML元素指定特定值一樣，把自己的data屬性傳遞給子組件的這個屬性。

而子組件內部發生什么事情的時候，就通過自定義事件來把這個事情涉及到的數據暴露出來，供父組件處理。

<my-component v-bind:foo="baz" v-on:event="doThis(arg1,...arg2)"></my-component>　　

以上代碼中，foo是 <my-component> 組件內部定義的prop屬性，baz 是父組件的一個data屬性，event是子組件定義的一個事件，doThis是父組件的一個方法。

　　　　父組件把baz數據通過prop傳遞給子組件的foo；

　　　　子組件內部得到foo的值，就可以進行相應的操作；

　　　　當子組件內部發生了一些變化，希望父組件能知道時，就利用代碼觸發event-a事件，把一些數據發送出去；

　　　　父組件把這個事件處理器綁定為doThis方法，子組件發送的數據，就作為doThis方法的參數被傳進來；

　　　　然后父組件就可以根據這些數據，進行相應的操作。

轉載于:https://www.cnblogs.com/150536FBB/p/11290472.html

總結

以上是生活随笔為你收集整理的vue中父子组件通信的坑的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。