vue3,ref重新设置父元素

在 Vue 3 中，`ref` 是响应式数据绑定的一种方式，它可以用来创建简单的组件属性。如果你想要在 `ref` 对象上重新设置其对应的 DOM 元素值，通常是在模板中直接操作这个引用，而不是直接修改它的值，因为 Vue 的模板是静态的。

例如，假设你有一个包含 `ref` 的 `<div>` 元素：

<div v-bind:class="{ active: isActiveRef.value }" ref="isActiveElement"></div>

然后在你的 Vue 实例里，你可以这样改变 `isActiveRef` 的值，它会自动更新页面上的 `class` 属性：

this.isActiveRef.value = true; // 将 div 设置为 active 状态

如果你想更改父元素，特别是当它是通过 `ref` 而不是直接引用时，可以这样做：

this.$refs.isActiveElement.parentNode.classList.add('parent-active');

这里我们先通过 `this.$refs` 访问到父元素的引用，然后使用 DOM API 修改父级状态。