用途:Element Plus 的 Drawer 组件用于在滑出面板中展示内容。当 Dialog 无法满足需求时,Drawer 提供几乎相同的 API,但带来不同的用户体验。适用于需要滑出面板、在抽屉中展示表单、侧边导航抽屉、可调整大小的抽屉或嵌套抽屉的场景。
主要能力:支持左、右、上、下四个方向;可拖拽调整大小;支持多层嵌套;可配置宽高尺寸;支持带遮罩或不带遮罩;可自定义头部与底部;支持关闭前确认、ESC 关闭、点击遮罩关闭、延迟打开/关闭、关闭后销毁子元素等。
使用方式:通过 v-model 控制显示,direction 设置方向(rtl/ltr/ttb/btt),size 设置尺寸,resizable 开启拖拽调整,append-to-body 用于嵌套抽屉,before-close 拦截关闭流程。组件暴露 handleClose 方法,可调用以触发 before-close 后关闭。
限制与注意:嵌套抽屉需使用 append-to-body 以避免定位问题;若内容不更新可使用 destroy-on-close 重新渲染;使用 before-close 时需调用 done() 才能关闭。资料未提供安装命令、收费或平台信息。