Drawer 抽屉
从屏幕边缘滑出的面板,常用于详情展示或表单填写。
右侧抽屉
默认从右侧滑出。
不同方向
通过 placement 设置弹出方向。
禁止遮罩关闭
设置 mask-closable 为 false 后点击遮罩层不会关闭。
Props
| 参数 | 类型 | 默认值 | 说明 |
|---|---|---|---|
modelValue | boolean | — | 是否显示(必填) |
title | string | — | 标题 |
placement | 'left' | 'right' | 'top' | 'bottom' | 'right' | 弹出方向 |
width | number | string | 360 | 宽度(左右方向生效) |
height | number | string | — | 高度(上下方向生效) |
maskClosable | boolean | true | 点击遮罩层是否关闭 |
Events
| 事件名 | 类型 | 说明 |
|---|---|---|
update:modelValue | (val: boolean) => void | 显隐状态变化 |
close | () => void | 关闭时触发 |
Slots
| 插槽名 | 说明 |
|---|---|
default | 抽屉主体内容 |
footer | 底部区域 |