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

vue類名如何獲取動態(tài)生成的元素

 更新時間：2022年04月20日 10:38:25   作者：北嶺有燕  
這篇文章主要介紹了vue類名如何獲取動態(tài)生成的元素，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教

類名獲取動態(tài)生成的元素

首先注意的是，該元素必須在id為app這個元素里面

?new Vue({
? ?el: "#app",
? })

其次是由于動態(tài)生成的，想獲取到該元素，需要在created里使用nextTick。

并且可以 $(’.circle’ + i)拼接想要的元素類名。

? this.$nextTick(() => {
? ? ? for (var i = 1; i < this.carlist.length + 1; i++) {
? ? ? ? ? $('.circle' + i).css("left", this.random(0, 1650))
? ? ? }
? })

在寫樣式的時候遇到了一點問題：

盒子的margin塌陷（發(fā)生在兩個盒子嵌套的時候，父盒子和子盒子同時設(shè)置margin的時候會出現(xiàn)實際的magin取的是兩個margin的最大值）

解決辦法：

給父元素增加

overflow:hidden

如何獲取并操作dom元素

方法一：

直接給的元素加id,使用document.getElementById(“id”)獲取，然后操作 dom 元素

mounted(){
?? ?this.element = document.querySelector('#element_1');
?? ?this.element.style.color = "red";
}

為什么是在mouted鉤子使用？

因為只有在執(zhí)行mounted的時候，vue才已經(jīng)渲染了dom節(jié)點，這個時候是可以獲取dom節(jié)點的

方法二：

使用ref,給元素添加ref=“name” ，使用 this.$refs.name 獲取到該元素，再對元素進行操作

// 定義ref
<div ref="div_1">獲取元素</div>
// 獲取并操作
this.$refs.div_1.style.backgroundColor="red"

建議：vue中盡量不去操作 dom 元素，選用 ref 操作屬性獲取

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

相關(guān)文章

最新評論