2019-10-22 13:19:12 +08:00
|
|
|
# Drawer
|
2020-02-08 16:07:25 +08:00
|
|
|
I think it is similar with modal, with a bit difference on placement.
|
2020-01-30 20:09:41 +08:00
|
|
|
## Demos
|
2019-10-22 13:19:12 +08:00
|
|
|
```demo
|
|
|
|
|
basic
|
2020-02-08 16:07:25 +08:00
|
|
|
multiple
|
2020-03-15 22:58:26 +08:00
|
|
|
target
|
2020-02-08 16:07:25 +08:00
|
|
|
```
|
|
|
|
|
## V-model
|
|
|
|
|
|prop|event|
|
|
|
|
|
|-|-|
|
|
|
|
|
|show|hide|
|
|
|
|
|
|
|
|
|
|
## Props
|
|
|
|
|
|Name|Parameters|Default|Description|
|
|
|
|
|
|-|-|-|-|
|
2020-05-30 17:20:27 +08:00
|
|
|
|theme|`'light' \| 'dark' \| null`|`null`||
|
|
|
|
|
|themed-style|`{ [themeName: string]: Object } \| null`|`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`|Works when placement is `top` and `bottom`.|
|
2020-02-08 16:07:25 +08:00
|
|
|
|mask-closable|`boolean`|`true`|Whether to emit `hide` event when click mask.|
|
2020-05-31 14:33:44 +08:00
|
|
|
|drawer-style|`Object`|`null`||
|
2020-03-20 22:25:21 +08:00
|
|
|
|target|`() => HTMLElement`|`() => document.body`|The area where the drawer appears.|
|
2020-03-12 11:13:29 +08:00
|
|
|
|drawer-class|`string`|`null`||
|
2020-02-08 16:07:25 +08:00
|
|
|
|
|
|
|
|
## Slots
|
|
|
|
|
|Name|Parameters|Description|
|
|
|
|
|
|-|-|-|
|
|
|
|
|
|default|`()`||
|
|
|
|
|
|
|
|
|
|
## Events
|
|
|
|
|
|Name|Parameters|Description|
|
|
|
|
|
|-|-|-|
|
|
|
|
|
|show|`()`||
|
|
|
|
|
|hide|`(show: false)`||
|
