左右各一个iframe 怎么把el-dialog 弹出到最外层的body上

可以使用 `appendTo` 属性将弹框挂载到指定的元素上。在弹框的 `created` 钩子函数中，可以通过获取最外层的 `body` 元素，然后将其作为 `appendTo` 的值，从而实现将弹框挂载到最外层的 `body` 上。

示例代码如下：

<!-- 最外层的页面 -->
<template>
  <div>
    <iframe src="iframe1.html"></iframe>
    <iframe src="iframe2.html"></iframe>
  </div>
</template>

<script>
export default {
  mounted() {
    const dialog = this.$dialog({
      title: '弹框标题',
      content: '弹框内容',
      appendTo: document.body // 将弹框挂载到最外层的 body 元素上
    });
  }
}
</script>

<!-- iframe1.html -->
<template>
  <div>
    <button @click="showDialog">显示弹框</button>
  </div>
</template>

<script>
export default {
  methods: {
    showDialog() {
      const dialog = this.$dialog({
        title: '弹框标题',
        content: '弹框内容',
        appendTo: parent.document.body // 将弹框挂载到最外层的 body 元素上
      });
    }
  }
}
</script>

<!-- iframe2.html -->
<template>
  <div>
    <button @click="showDialog">显示弹框</button>
  </div>
</template>

<script>
export default {
  methods: {
    showDialog() {
      const dialog = this.$dialog({
        title: '弹框标题',
        content: '弹框内容',
        appendTo: parent.document.body // 将弹框挂载到最外层的 body 元素上
      });
    }
  }
}
</script>

在子页面的弹框中，使用 `parent.document.body` 获取到父级页面的 `body` 元素，作为 `appendTo` 的值即可。