vue3 el-dialog 插槽

Vue 3 的 `el-dialog` 组件是 Element UI 提供的一个对话框组件，用于展示用户交互信息。在 Vue 3 中，插槽的使用方式与 Vue 2 略有不同。

`el-dialog` 组件提供了两个默认插槽：`title` 和 `default`。你可以使用这两个插槽来自定义对话框的标题和内容。

下面是一个使用 `el-dialog` 组件自定义插槽的示例代码：

<template>
  <el-dialog v-model="dialogVisible" title="Custom Dialog Title">
    <template #default>
      <p>This is the content of the dialog.</p>
    </template>
    <template #title>
      <h3>{{ customTitle }}</h3>
    </template>
  </el-dialog>
</template>

<script>
export default {
  data() {
    return {
      dialogVisible: false,
      customTitle: "Custom Dialog Title"
    };
  }
};
</script>

在上面的示例中，我们通过 `v-model` 绑定了 `dialogVisible` 变量来控制对话框的显示和隐藏。通过 `title` 属性设置了默认的对话框标题。

然后，我们使用了 `default` 插槽来自定义对话框的内容，放置了一个 `<p>` 标签作为内容展示。同时，我们还使用了 `title` 插槽来自定义对话框标题，其中的标题内容使用了 `customTitle` 变量。

你可以根据需要在这两个插槽中添加自己的 HTML 结构和逻辑，来满足特定的需求。