父組件中調用子組件的方法和屬性


  方案:利用ref屬性可以獲取到dom元素或者是子組件,從而可以調用子組件的方法(注意2.0版本用ref取代了el)

1、當ref直接定義在dom元素上時,則通過this.$refs.name可以獲取到dom,對dom進行原生的操作

<div class="foods-wrapper" ref="foods-wrapper">

  通過this.$refs獲取到dom進行操作(注意ref屬性的命名不能用駝峰,同時獲取的時候也不能用

let menuList = this.$refs['menu-wrapper'].getElementsByClassName('menu-list-hook');
//此處如果用this.$refs["menuWrapper"]將獲取不到元素

2、通過在引用的子組件上使用ref屬性實現父組件調用子組件的方法以及屬性

  在父組件中引用子組件並定義ref

<v-food ref="selectfood"></v-food>

  調用定義在子組件中的方法show

this.$refs.selectfood.show();//同時也可以調用子組件中的屬性

  this.$refs.selectfood,返回的是一個vue對象,所以可以直接調用其方法

 


免責聲明!

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



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