mounted里面this.$refs.xxx的內容是undefined


在mounted(){}鈎子里面使用this.$refs.xxx,打印出來的卻是undefined?

DOM結構已經渲染出來了,但是如果在DOM結構中的某個DOM節點使用了v-if、v-show或者v-for(即根據獲得的后台數據來動態操作DOM,即響應式),那么這些DOM是不會再mounted階段找到的。

所以如果在mounted鈎子中使用$refs,如果ref是定位在有v-if、v-for、v-show中的DOM節點,這些判斷下的DOM還沒渲染,返回來的只能是undefined,因為在mounted階段他們根本不存在!

如果說mounted階段是加載階段,那么updated階段則是完成了數據更新到DOM的階段(對加載回來的數據進行處理),此時,ref、數據等等全部都掛載到DOM結構上去,在update階段使用this.$refs.xxx,就100%能找到該DOM節點。

updated與mounted不同的是,在每一次的DOM結構更新,vue都會調用一次updated(){}鈎子函數!而mounted僅僅渲染完成時只執行一次而已。

簡單來說,只要在調試的時候,能看到元素的存在,在updated生命周期里可以使用this.$refs.xxx找到對應的DOM節點!


免責聲明!

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



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