2020-02-04 14:34:56 +08:00
|
|
|
# 抽屉 Drawer
|
2020-02-08 16:07:25 +08:00
|
|
|
我感觉和 Modal 功能差不太多，位置有点差别。
|
2020-02-04 14:34:56 +08:00
|
|
|
## 演示
|
|
|
|
|
```demo
|
|
|
|
|
basic
|
2020-02-08 16:07:25 +08:00
|
|
|
multiple
|
2020-03-15 22:58:26 +08:00
|
|
|
target
|
2020-03-06 16:13:45 +08:00
|
|
|
dark-1-debug
|
|
|
|
|
dark-2-debug
|
|
|
|
|
dark-3-debug
|
|
|
|
|
dark-4-debug
|
2020-02-08 16:07:25 +08:00
|
|
|
```
|
|
|
|
|
## V-model
|
|
|
|
|
|prop|event|
|
|
|
|
|
|-|-|
|
|
|
|
|
|show|hide|
|
|
|
|
|
|
|
|
|
|
## Props
|
|
|
|
|
|名称|类型|默认值|说明|
|
|
|
|
|
|-|-|-|-|
|
2020-03-12 11:13:29 +08:00
|
|
|
|theme|`'light' \| 'dark'`|`null`||
|
|
|
|
|
|themed-style|`{ [themeName: string]: object }`|`null`||
|
2020-02-08 16:07:25 +08:00
|
|
|
|show|`boolean`|`false`||
|
|
|
|
|
|placement|`'top' \| 'right' \| 'bottom' \| 'left'`|`'right'`||
|
2020-02-28 19:46:06 +08:00
|
|
|
|width|`number \| string`|`251`||
|
|
|
|
|
|height|`number \| string`|`251`|在位置是 `top` 和 `bottom` 时生效|
|
2020-02-08 16:07:25 +08:00
|
|
|
|mask-closable|`boolean`|`true`|点击遮罩时是否发出 `hide` 事件|
|
|
|
|
|
|drawer-style|`object`|`null`||
|
2020-03-17 16:48:36 +08:00
|
|
|
|target|`() => HTMLElement`|`undefined`|抽屉出现的区域|
|
2020-03-12 11:13:29 +08:00
|
|
|
|drawer-class|`string`|`null`||
|
2020-02-08 16:07:25 +08:00
|
|
|
|
|
|
|
|
## Slots
|
|
|
|
|
|名称|参数|说明|
|
|
|
|
|
|-|-|-|
|
|
|
|
|
|default|`()`||
|
|
|
|
|
|
|
|
|
|
## Events
|
|
|
|
|
|名称|参数|说明|
|
|
|
|
|
|-|-|-|
|
|
|
|
|
|show|`()`||
|
|
|
|
|
|hide|`(show: false)`||
|
