当前位置: 首页 > 工具软件 > v-modal > 使用案例 >

Vue 弹窗黑色遮罩 class v-modal

潘秦斩
2023-12-01

v-modal 不要看成 v-model 哦!

很明显 你是在弹窗中打开弹窗了
对内层弹窗设置 append-to-body 默认值为 false ;写了就表示true;
如需要自己决定 :append-to-body=“appendToBody”

element-dialog 链接
Element-Dialog

//element 官网示例
<template>
  <el-button type="text" @click="outerVisible = true">点击打开外层 Dialog</el-button>
  
  <el-dialog title="外层 Dialog" :visible.sync="outerVisible">
    <el-dialog
      width="30%"
      title="内层 Dialog"
      :visible.sync="innerVisible"
      append-to-body>
    </el-dialog>
    <div slot="footer" class="dialog-footer">
      <el-button @click="outerVisible = false">取 消</el-button>
      <el-button type="primary" @click="innerVisible = true">打开内层 Dialog</el-button>
    </div>
  </el-dialog>
</template>
<script>
  export default {
    data() {
      return {
        outerVisible: false,
        innerVisible: false
      };
    }
  }
</script>
 类似资料: