vue3页面中获取querySelector

在 Vue 3 中，可以使用`ref`和`nextTick`方法来获取一个元素的引用并执行类似于`querySelector`的操作。下面是一个示例：

首先，在组件的`setup`方法中，使用`ref`创建一个元素引用变量：

import { ref, nextTick } from 'vue';

export default {
  setup() {
    const myElement = ref(null);

    // ...

    return {
      myElement,
      // ...
    };
  },
};

然后，在模板中，将要获取的元素绑定到相应的DOM元素上：

<template>
  <div ref="myElement">...</div>
</template>

接下来，在组件的其他地方，可以通过访问`myElement.value`来获取对该元素的引用。例如，在一个方法中使用`nextTick`来确保在DOM更新之后执行查询操作：

methods: {
  doQuery() {
    nextTick(() => {
      const element = this.myElement.value;
      // 执行查询操作，例如：
      const result = element.querySelector('.my-selector');
    });
  },
},

这样就可以在 Vue 3 页面中获取类似于`querySelector`的功能了。