用ref 注冊子組件,父組件可以通過this.$refs.xx.fn調用子組件里的函數,但是有時會出現 fn 為定義的情況,這是為什么呢?
vue 官網中ref 下有一段話 "關於 ref 注冊時間的重要說明:因為 ref 本身是作為渲染結果被創建的,在初始渲染的時候你不能訪問它們 - 它們還不存在!$refs
也不是響應式的,因此你不應該試圖用它在模板中做數據綁定。"
也就是說 ref 只有等頁面加載完成好之后你才能調用 this.$refs ,如果你使用v-if 、v-for渲染頁面的話,那么在剛開始頁面沒沒渲染之前你是拿不到this.$refs 的,所以要等到頁面渲染之后拿才可以
解決辦法:
1、如果你在mounted里獲取this.$refs,因為dom還未完全加載,所以你是拿不到的, update階段則是完成了數據更新到 DOM 的階段(對加載回來的數據進行處理),此時,就可以使用this.$refs了
2、如果寫在method中,那么可以使用 this.$nextTick(() => {}) 等頁面渲染好再調用,這樣就可以了
3、或者加個定時器延時加載this.$refs(這個方法還沒有試)