elementui--去掉弹框的黑色罩子
属性:
:modal-append-to-body="false" 去掉黑色面罩
<template slot-scope="scope"> <el-button @click="queryDeployLog(scope.row)" type="primary" style="margin-left: 16px;">点我打开el-button> <el-drawer title="我是外面的 Drawer" :visible.sync="drawer2" size="50%" :modal-append-to-body="false"> <div> <el-button @click="innerDrawer = true">打开里面的!el-button> <el-drawer title="我是里面的" :append-to-body="true" :before-close="handleClose" :visible.sync="innerDrawer"> <p>_(:зゝ∠)_p> el-drawer> div> el-drawer> template>
通过上面这个参数,可以去掉黑色面罩,但是当dialog或drawer嵌套的时候,关掉最里面的窗口后,最外面一层上又上了黑色面罩,这种情况下,需要将:modal-append-to-body="false" 这个参数换成:append-to-body="true" 即可
并且在使用下来发现,:append-to-body="true"方法更佳更稳妥
<template slot-scope="scope"> <el-button @click="queryDeployLog(scope.row.id)" type="text" style="margin-left: 16px;">查看el-button> <el-drawer title="应用发布日志" :visible.sync="drawer2" direction="rtl" size="50%" :append-to-body="true"> <el-table :data="gridData"> <el-table-column property="ip" label="ip">el-table-column> <el-table-column property="status" label="状态">el-table-column> <el-table-column property="create_time" label="时间">el-table-column> <el-table-column fixed="right" label="日志" width="120"> <template slot-scope="scope"> <el-button type="text" @click="queryDeployFlowdLog(scope.row)">查看el-button> <el-dialog title="提示" :visible.sync="dialogVisible3" :append-to-body="true"> <div style="white-space: pre-wrap" v-html="deploy_log">div> <el-button type="primary" @click="closeDeployFlowLog">关闭el-button> el-dialog> template>