element中drawer模板的实现,
3672Js.Com2023-07-20 00:31 来源:未知 阅读:9291 关注度4
element中drawer模板的实现,
目录
- 1、效果图
- 2、上代码
1、效果图
2、上代码
<template> <div> <el-drawer size="100%" :visible.sync="drawer" style="position: absolute;" class="details" :modal-append-to-body="false" :modal = "false" :before-close="handleClose"> </el-drawer> </div> </template> <script> export default { data() { return { drawer: false, } }, methods: { /** 初始化 */ init(){ this.drawer = true }, /** 关闭回调*/ handleClose(){ this.drawer = false } } } </script> <style lang="scss" scoped> ::v-deep .el-drawer__header { font-size: 22px; text-align: center; margin-bottom: 16px; padding: 0; .el-drawer__close-btn{ background-color: rgb(255, 77, 79); color: white; } } ::v-deep .el-drawer__body { padding: 0px; } .details { width: 80%; margin-right: 0px; margin-left: 20%; box-shadow: 0 2px 12px 0 rgb(0 0 0 / 10%); } </style>
到此这篇关于element中drawer模板的实现的文章就介绍到这了,更多相关element drawer模板内容请搜索3672js教程以前的文章或继续浏览下面的相关文章希望大家以后多多支持3672js教程!
您可能感兴趣的文章:- 解决element-ui el-drawer抽屉el-dialog弹框关闭优化demo
- element Drawer 抽屉无法渲染问题及解决
本站文章为3672js教程网友分享投稿,版权归原作者,欢迎任何形式的转载,但请务必注明出处。同时文章内容如有侵犯了您的权益,请联系我们处理。
评论已被关闭