vue3.2在setup语法糖中如何写点击事件

在Vue 3.2中，可以通过使用 `ref` 来获取 DOM 元素，并使用 `setup` 中的 `onMounted` 或 `onUpdated` 钩子函数来添加事件监听器。例如，如果要在按钮被点击时执行一个函数，可以按照以下步骤进行操作：

1. 在模板中定义一个按钮元素，并给它添加一个 `ref` 属性：

<template>
  <button ref="myButton">点击我</button>
</template>

2. 在 `setup` 中使用 `ref` 获取按钮元素，并在 `onMounted` 钩子函数中添加一个点击事件监听器：

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

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

    onMounted(() => {
      myButton.value.addEventListener('click', handleClick);
    });

    const handleClick = () => {
      console.log('按钮被点击了！');
    };

    return {
      myButton,
    };
  },
};
</script>

在这个例子中，我们使用 `ref` 创建了一个名为 `myButton` 的引用，并在 `onMounted` 钩子函数中添加了一个点击事件监听器，用于在按钮被点击时执行 `handleClick` 函数。在 `handleClick` 函数中，我们只是简单地输出一条消息到控制台。

注意，在 `setup` 中使用 `ref` 时，需要使用 `.value` 属性来访问引用的实际值。因此，在 `onMounted` 钩子函数中，我们需要使用 `myButton.value` 来访问按钮元素。