element UI dialog 固定高度 且关闭时清空数据 <el-dialogtitle="xxx":visible.sync="dialogTimeVisible "@close='closeDialog'> <divclass="el-dialog-div">XXX...</div></el-dialog><stylelang="scss"scoped>.el-dialog-div{height:60vh;overflow:auto;}</style> methods: { closeDialog(){ this.XXX...
const dialogHeaderEl = el.querySelector('.el-dialog__header'); //弹窗 const dragDom = el.querySelector('.el-dialog'); //给弹窗加上overflow auto;不然缩小时框内的标签可能超出dialog; dragDom.style.overflow = "auto"; //清除选择头部文字效果 dialogHeaderEl.onselectstart = new Function("retu...
.el-dialog__body {position: absolute;left:0;top: 54px;bottom:0;right:0;padding:0; z-index:1;overflow: hidden; overflow-y: auto; } } 在el-dialog标签中设置class="abow_dialog"即可 弹窗为页面高度的90%,且上下居中。 el-dialog__body内容部分会根据内容的高度,自动显示上下的滚动条。 我项目中...
const dialogHeaderEl = el.querySelector('.dialog_header'); // 获取弹窗 const dragDom = el.querySelector('.el-dialog') // 给弹窗加上overflow:auto;不然缩小时框内的标签可能超出dialog dragDom.style.overflow = 'auto' // 头部加上可拖动cursor dialogHeaderEl.style.cursor = 'move' // 头部拖...
<el-dialogtitle="提示":visible.sync="dialogVisible"width="30%":before-close="handleClose"><divclass="el-dialog-div">这是一段信息</div><spanslot="footer"class="dialog-footer"><el-button@click="dialogVisible = false">取消</el-button><el-buttontype="primary"@click="dialogVisible = false...
el-dialog主体区域添加了el-scrollbar滚动条,为什么el-dialog必须设置固定高度(比如height:100%)才能滚动?否则滚动条就无效?感觉不适合写死高度啊,应该根据内容自动调整高度,但是不能超出一个屏幕高度 element-ui 有用关注1收藏 回复 阅读2.4k 1 个回答
另外,你还可以通过设置Dialog组件的最小高度和最大高度来限制高度的范围。例如,可以使用`:min-height`和`:max-height`属性来设置最小高度和最大高度: ``` <el-dialog :min-height="200" :max-height="400"> <!--对话框内容--> </el-dialog> ``` 对话框将始终根据其内容的高度调整自身的高度,以提供...
依照elementUI文档给dialog添加了 custom-class 之后利用 ::v-deep 穿透,在css中添加以下代码就能实现高度超出了: .container-box{ //弹出层的高度 ::v-deep .el-dialog.import-dialog{ height: auto; max-height: 80vh; overflow-y: auto; }
-- import CSS --><linkrel="stylesheet"href="https://unpkg.com/element-ui/lib/theme-chalk/index.css"></head><body><divid="app"><el-button@click="visible = true">Button</el-button><el-dialog:visible.sync="visible"title="Hello world"><p>Try Element</p></el-dialog></div></...