在Vue3中如何快捷的操作dom元素（改样式、加事件等等）

在vue3中操作dom元素其实还是可以用以前的方法如querySelector等等这些，但这些需要在nextTick中使用，不然不起效，下面是另一种更简便的方法：

当然，下面的方法需要在你能给这个元素添加ref值时使用，像集成式的那种还是建议麻烦一点，用id、class名这些来获取元素进行操作。 

 第一步

给你想要操作的dom元素设置一个ref值

ref相当于这个元素的id

如

<div ref="dom">写什么呢</div>

---

 第二步

在script标签内定义一个与你设定的ref值相同名字的值

可以更好的在标签内操作这个元素

如

const dom = ref(null);

---

 第三步

现在就可以操作这个元素了

如（改变这个元素的position）：

dom.value.style.position = "fixed";

这里需要加上.value，是因为之前定义是是使用ref，就肯定是要加上.value的