方法一: 直接给的元素加id,使用document.getElementById(“id”)获取,然后操作 dom 元素

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

为什么是在mouted钩子使用?
因为只有在执行mounted的时候,vue才已经渲染了dom节点,这个时候是可以获取dom节点的

方法二: 使用ref,给元素添加ref=“name” ,使用 this.$refs.name 获取到该元素,再对元素进行操作

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

建议:vue中尽量不去操作 dom 元素,选用 ref 操作属性获取

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐