鍍金池/ 問(wèn)答/網(wǎng)絡(luò)安全  HTML/ 關(guān)于VUE的請(qǐng)求數(shù)據(jù)和獲取DOM的順序，有個(gè)疑惑想請(qǐng)問(wèn)一下前輩

關(guān)于VUE的請(qǐng)求數(shù)據(jù)和獲取DOM的順序，有個(gè)疑惑想請(qǐng)問(wèn)一下前輩

前輩好，最近在初學(xué)vue，遇到一個(gè)問(wèn)題思考不出解決方案，所以想請(qǐng)教一下。

html結(jié)構(gòu)就這樣，我想獲取ul下面的第一個(gè)li的高度，li是用v-for循環(huán)出來(lái)的

圖片描述

但是我在mounted鉤子函數(shù)里，寫了這句話

圖片描述

不行，獲取不了，但是我如果加個(gè)延時(shí)器延時(shí)個(gè)2秒再執(zhí)行就可以了，所以我猜應(yīng)該就是渲染的順序問(wèn)題

我想請(qǐng)問(wèn)前輩，前輩，到底應(yīng)該怎么寫才可以在li渲染之后，再獲取到它的高度呢？？？還有一點(diǎn)，也是我最近在寫練習(xí)的時(shí)候遇到的，就是請(qǐng)問(wèn)如何在其他組件里面獲取到其他組件的高度？？？？

希望能得到前輩指教！打擾了！

補(bǔ)充一下，那個(gè)循環(huán)的數(shù)據(jù)我是通過(guò)axios訪問(wèn)我在static創(chuàng)建的一個(gè)假的json數(shù)據(jù)
圖片描述

按下面前輩說(shuō)的，加個(gè)$nextTick
圖片描述

還是不行
圖片描述

回答
編輯回答
扯不斷

this.$nextTick()

2017年12月24日 18:49
編輯回答
局外人

https://vuejs.org/v2/guide/in...
那推薦參考這里, 在 updated 的 hook 里處理

2017年1月21日 00:29
編輯回答
巷尾

要寫在axios請(qǐng)求的then回調(diào)里

this.$nextTick(()=>{

})
試試

2018年8月2日 14:39
編輯回答
殘淚

你獲取的時(shí)候DOM還沒(méi)更新，需要更新完了再獲取高度。vue里提供了全局方法 nextTick 去實(shí)現(xiàn)。

this.$nextTick(() => {
    // 你的代碼
})
2018年6月8日 18:26