欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

vue中動態(tài)渲染數(shù)據(jù)時使用$refs無效的解決

 更新時間：2023年01月23日 12:15:57   作者：TO_WebNow  
這篇文章主要介紹了vue中動態(tài)渲染數(shù)據(jù)時使用$refs無效的解決方案，具有很好的參考價值。希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教

vue動態(tài)渲染數(shù)據(jù)時使用$refs獲取dom無法獲取問題

場景：在循環(huán)的列表上綁定了 ref, 想當(dāng)數(shù)據(jù)動態(tài)渲染完了，然后獲取列表，接著就是獲取不到了

解決辦法

在請求數(shù)據(jù)了以后,方法內(nèi)后, 加上

this.$nextTick(() => {
// 在這里獲取 this.$refs.dom
})

列子

messList().then(res => {
? ? ?console.log(res)
? ? ?Toast.success('獲取成功')
? ? ?this.contentlist = [...res.data.data]
? ? ?this.$nextTick(() => {
? ? ? ? ?this.sideWrap()
? ? ?})
?})

vue中$refs取值是undefined

ref 被用來給元素或子組件注冊引用信息。

引用信息將會注冊在父組件的 $refs 對象上。

如果在普通的 DOM 元素上使用，引用指向的就是 DOM 元素，如果用在子組件上，引用就指向組件實(shí)例。

如果使用 v-if dom 就不會被渲染 ref 會一直獲取的是undifined，這時可以利用下面方式獲取數(shù)據(jù)

<div :class="currentStep==0?'el-form-item-show':'el-form-item-hidden'">
.el-form-item-hidden {display: none;}
.el-form-item-show {display: block;}

或者使用setTimeout得到數(shù)據(jù)

setTimeout(() => {

}, 0)

總結(jié)

以上為個人經(jīng)驗(yàn)，希望能給大家一個參考，也希望大家多多支持腳本之家。

相關(guān)文章

最新評論