vue組件之間的通信傳值


父子組件之間的通信

1、直接利用組件自帶的 $parent 和 $refs屬性 訪問指定的父組件與定義了ref名字的子組件,獲取其屬性或者方法:

           父組件內需要注意的是,在父組件內利用this.$refs獲取子組件,在created函數內是獲取不到的,此時虛擬DOM和數據還沒結合成真正的dom,是獲取不到的,可以在mounted函數內去獲取

                  父組件:

                子組件內:

 

2、利用自定義的屬性和自定義的方法進行父子組件的通信:

  父傳子:在父組件內的子組件標簽上利用一個自定義的屬性,將需要傳遞的值傳遞給子組件,在子組件內,利用props屬性,接受傳過來的值:

  子傳父:在父組件內的子組件標簽上綁定一個自定義的事件,在子組件內,利用   this.$emit('sendData',this,childData) 第一個參數是事件名,第二個參數是傳遞的數據 

                  父組件內:

 

                  子組件內:


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM