html 中vue3获取动态创建ref节点属性节点

可以使用 `reactive` 函数来创建响应式对象，然后在动态创建的节点上使用 `v-bind` 指令将响应式对象中的属性绑定到节点的属性上。

例如，在 Vue 3 中可以这样实现：

<template>
  <div ref="myRef" :class="myClass"></div>
</template>

<script>
import { reactive, onMounted } from 'vue';

export default {
  setup() {
    const state = reactive({
      myClass: 'red',
    });

    onMounted(() => {
      // 获取动态创建的节点
      const myRef = this.$refs.myRef;
      // 修改响应式对象中的属性
      state.myClass = 'blue';
      // 查看节点的属性是否更新
      console.log(myRef.className); // 输出 'blue'
    });

    return {
      myClass: state.myClass,
    };
  },
};
</script>

在上面的例子中，我们创建了一个响应式对象 `state`，它有一个属性 `myClass`，初始值为 `red`。在模板中，我们使用 `v-bind` 指令将 `myClass` 属性绑定到了动态创建的节点的 `class` 属性上。在 `onMounted` 钩子函数中，我们获取了动态创建的节点，修改了 `myClass` 属性的值，然后查看了节点的 `className` 属性，发现它已经更新为 `blue`。