vue3获取多个同名dom元素 不用v-for 并且添加类名

可以使用 Vue 3 的 `ref` 和 `querySelectorAll` 方法来获取多个同名的 DOM 元素，并且添加类名。具体步骤如下：

1. 在模板中，给需要获取的 DOM 元素添加 `ref` 属性：

<div ref="myDiv"></div>
<div ref="myDiv"></div>
<div ref="myDiv"></div>

2. 在组件中，使用 `$refs` 属性和 `querySelectorAll` 方法来获取多个同名的 DOM 元素：

import { ref, onMounted } from 'vue';

export default {
  setup() {
    const myDivs = ref([]);

    onMounted(() => {
      myDivs.value = Array.from(document.querySelectorAll('[ref="myDiv"]'));
    });

    const addClassName = () => {
      myDivs.value.forEach(div => {
        div.classList.add('my-class');
      });
    };

    return {
      myDivs,
      addClassName
    };
  }
};

3. 在需要的时候，调用 `addClassName` 方法来给多个同名的 DOM 元素添加类名：

<button @click="addClassName">Add Class Name</button>

这样，就可以在不使用 `v-for` 的情况下，获取多个同名的 DOM 元素，并且给它们添加类名了。注意，在组件中通过 `onMounted` 钩子获取 DOM 元素是一个比较好的实践，因为此时模板中的 DOM 元素已经被渲染出来了。