方案:利用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對象,所以可以直接調用其方法