vue3怎么实现addEventlistener

在Vue3中，可以使用`ref`和`onMounted`来实现添加事件监听器。具体步骤如下：

1. 在模板中添加一个元素，并为其设置一个`ref`属性，例如：

   <div ref="myElement">Click me!</div>

2. 在组件中，使用`ref`获取该元素，例如：

   import { ref, onMounted } from 'vue';
   
   export default {
     setup() {
       const myElement = ref(null);
       
       onMounted(() => {
         myElement.value.addEventListener('click', handleClick);
       });
       
       const handleClick = () => {
         console.log('Element clicked!');
       };
       
       return {
         myElement,
       };
     },
   };

在`setup`函数中，使用`ref`创建一个`myElement`变量，并在`onMounted`生命周期钩子中添加点击事件的监听器。

3. 在组件中，添加一个处理点击事件的函数，例如：

   const handleClick = () => {
     console.log('Element clicked!');
   };

这个函数将在元素被点击时被调用。

4. 最后，在组件中返回`myElement`变量，以便在模板中使用它，例如：

   return {
     myElement,
   };

然后，可以在模板中使用`myElement`变量来引用元素，并为其添加其他属性或样式。例如：

   <div ref="myElement" class="clickable">Click me!</div>

在这个例子中，`myElement`变量引用了一个类名为`clickable`的元素，该元素将在被点击时触发`handleClick`函数。