el-dialog append-to 怎么用

`el-dialog` 是 Element UI 框架中的一个组件，用于创建模态对话框。`append-to` 属性用于指定对话框的挂载点，默认为 `body`。通过设置 `append-to` 属性，可以将对话框挂载到指定的 DOM 元素下。

以下是 `el-dialog` 组件使用 `append-to` 属性的示例：

<template>
  <div>
    <el-button type="primary" @click="dialogVisible = true">打开对话框</el-button>

    <el-dialog
      title="提示"
      :visible.sync="dialogVisible"
      width="30%"
      append-to="dialog-container">
      <span>这是一段信息</span>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
      </span>
    </el-dialog>

    <div id="dialog-container"></div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      dialogVisible: false
    };
  }
};
</script>

在这个示例中，`el-dialog` 的 `append-to` 属性被设置为 `dialog-container`，这意味着对话框将被挂载到 `id` 为 `dialog-container` 的 DOM 元素下。如果没有设置 `append-to` 属性，对话框将默认挂载到 `body` 元素下。