這篇文章主要介紹了vue.js獲取dom的方法，具有一定借鑒價(jià)值，需要的朋友可以參考下。希望大家閱讀完這篇文章后大有收獲。下面讓小編帶著大家一起了解一下。
成都創(chuàng)新互聯(lián)公司始終堅(jiān)持【策劃先行，效果至上】的經(jīng)營理念，通過多達(dá)十載累計(jì)超上千家客戶的網(wǎng)站建設(shè)總結(jié)了一套系統(tǒng)有效的營銷解決方案，現(xiàn)已廣泛運(yùn)用于各行各業(yè)的客戶，其中包括：成都地磅秤等企業(yè)，備受客戶稱贊。
vue.js獲取dom的方法：1、給html中原始標(biāo)簽對(duì)或子組件中定義ref屬性，在【mounted(){}】方法后使用【this.$refs】獲取DOM元素；2、mounted對(duì)組件的內(nèi)容進(jìn)行了修改后繼續(xù)用【this.$refs】。
vue.js獲取dom的方法：
給html中原始標(biāo)簽對(duì)或子組件中定義ref屬性,在mounted(){}方法或者此方法后使用this.$refs.具體的ref值來獲取DOM元素。因?yàn)槭褂胢ounted以前的鉤子函數(shù)時(shí),還未將組件掛載到DOM上，自然也無法通過$refs獲取DOM上的元素;
需要區(qū)分的是,打印this.$refs.具體的ref值, 若是原始標(biāo)簽對(duì)則輸出的結(jié)果是原始標(biāo)簽對(duì)，若ref屬性在子組件標(biāo)簽中，則輸出的是組件對(duì)象,而不是組件對(duì)應(yīng)template中的內(nèi)容;
this.$refs 輸出的是當(dāng)前組件中包含的定義了ref屬性的標(biāo)簽或子組件的集合;
在組件渲染過程中，如mounted期間對(duì)組件的內(nèi)容進(jìn)行了修改后繼續(xù)用this.$refs.被修改組件對(duì)應(yīng)的ref,這個(gè)時(shí)候獲取的是修改之前的DOM元素,為了獲取修改之后的DOM元素,必須使用this.$nextTick()方法,并在該方法的回調(diào)函數(shù)中使用this.$refs,此時(shí)便是獲取到修改之后的DOM元素。當(dāng)然要獲取修改之后的DOM元素可以在updated函數(shù)下,但是在某些具體的場(chǎng)景下需要在mounted中獲取修改后的DOM元素;
重慶分公司
重慶分公司
