vue子組件與父組件通訊詳解

這次帶給大家vue子組件與父組件通信詳解，使用vue子組件與父組件通信詳解的注意事項有哪些，下面就是實戰案例，一起來看一下。

一、父元件與子元件通信，
1、在插入的子元件的標籤傳入屬性值
如圖：

#2、在子元件用props接收，
如圖：

#zhijeidiaoyo

##直接呼叫this.title即可；

二、子元件傳遞參數給父元件

使用this.$emit("parents",111)監聽parents
事件，在父元件上直接綁定change方法如圖：

三、子元件與子元件通訊

1、先在
main.js 裡面，建立事件中心

2、子元件2觸發事件如下

this.$root.event.$emit("NAME2","child2的資料")

2017- 11-01_14512vue子組件與父組件通訊詳解

3.子元件1接收如下

this.$root.event.$on("NAME2",function (d) {
huang.msg2 = d;
})

相信看了本文案例你已經掌握了方法，更多精彩請關注php中文網

其它相關文章！

相關閱讀：

修改捲軸樣式的方法

#讓頁面動起來的WOW.js

以上是vue子組件與父組件通訊詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章！