嵌套 dialog

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

       <el-dialog
         title="外层对话框"
         :visible.sync="outerVisible"
         width="30%"
         :before-close="handleClose">
         <span>这是外层对话框的内容</span>
         <el-button type="primary" @click="innerVisible = true">打开内层对话框</el-button>

         <el-dialog
           width="30%"
           title="内层对话框"
           :visible.sync="innerVisible"
           append-to-body>
           <span>这是内层对话框的内容</span>
         </el-dialog>
       </el-dialog>
     </div>
   </template>

   <script>
   export default {
     data() {
       return {
         outerVisible: false,
         innerVisible: false
       };
     },
     methods: {
       handleClose(done) {
         this.$confirm('确认关闭？')
           .then(_ => {
             done();
           })
           .catch(_ => {});
       }
     }
   };
   </script>

   <style scoped>
   /* 你可以在这里添加一些样式 */
   </style>