vue3在el-dialog如何使用addEventListener

在Vue 3中，可以使用`ref`来获取对话框元素，然后使用`$el`属性来访问原生DOM元素。然后，您可以使用`addEventListener`来为该元素添加事件监听器。以下是一个例子：

<template>
  <el-dialog :visible.sync="dialogVisible" title="Dialog Title" width="30%">
    <p>Some content...</p>
  </el-dialog>
</template>

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

export default {
  setup() {
    const dialog = ref(null);
    const dialogVisible = ref(false);

    const showDialog = () => {
      dialogVisible.value = true;
      dialog.value.$el.addEventListener('click', handleClick);
    };

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

    return {
      dialog,
      dialogVisible,
      showDialog,
    };
  },
};
</script>

在上面的例子中，我们首先使用`ref`创建一个对话框引用。然后，在`showDialog`方法中，我们设置对话框可见，并使用`$el`访问原生DOM元素，并添加一个点击事件监听器。当用户点击对话框时，`handleClick`方法将被调用并输出一条消息。