ref 可以用來獲取到dom節點，如果在組件中應用，也可以用來獲取子組件的數據和方法。

比如，我定義了一個home組件，一個head組件，home組件中引用head組件。

此時，home組件是head組件的父級，我想在home（父組件）組件中，獲取head（子組件）組件中定義的數據和方法

<v-head ref="header"></v-head> // v-head 為 head 組件在 home 組件中注冊的標簽名，ref='header' 相當于獲取到當前組件

<button @click='getHeadData()'>父組件主動獲取子組件定義的數據和方法</button> getHeaderData() { // home 組件 methods 下定義的方法this.$refs.header.on_alert(); // on_alert() 是 head 組件中定義的一個方法 }

?

這樣，就可以在父組件中，主動獲取到子組件中的數據和方法。

當然，子組件也可以主動獲取父組件的數據和方法。

this.$parent.run() // run 為 home 組件中定義的方法，在 head 組件中可以直接調用

?

轉載于:https://www.cnblogs.com/Sky-Ice/p/9289123.html

《新程序員》：云原生和全面數字化實踐50位技術專家共同創作，文字、視頻、音頻交互閱讀

總結

以上是生活随笔為你收集整理的vue组件通信之父组件主动获取子组件数据和方法的全部內容，希望文章能夠幫你解決所遇到的問題。

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