vant4中文官网,vant4 表单,vant4 uniapp,vant4 popup,vant4 list,vant4 cascader 级联多选
Vant4 useEventListener 是一个 Vue 3 的自定义 Hook，它用于在组件中添加监听器。

使用 useEventListener 可以帮助我们更轻松地管理事件监听器，同时避免出现一些常见的问题，例如内存泄漏和重复绑定同一事件等。

该 Hook 接收三个参数：

1. target: 目标元素，可以是一个 DOM 元素或者一个 Ref 对象。
2. type: 事件类型，如 "click"、"keydown" 等。
3. listener: 事件处理函数，当事件被触发时会调用该函数。

下面是一个简单的示例，展示了如何使用 useEventListener 监听鼠标点击事件：

vue
<template>
<div>
<button ref="btn">Click me</button>
<p>Button clicked {{ count }} times.</p>
</div>
</template>

<script>
import { ref } from 'vue';
import { useEventListener } from 'vant';

export default {
setup() {
const count = ref(0);
const btnRef = ref(null);

useEventListener(btnRef, 'click', () => {
count.value++;
});

return {
count,
btnRef,
};
},
};
</script>


在上面的示例中，我们首先通过 ref 创建了一个按钮的引用 (btnRef)，然后使用 useEventListener 将点击事件绑定到该按钮上。每当用户单击按钮时，计数器 (count) 的值就会增加，并且对应的文本也会更新。