@58fe/p5/src/doc/drawer.md

pc端vue组件

<script>
	module.exports = {
		data() {
			return {
				showDrawer: false,
				direction: 'right'
			}
		},
		methods: {
			input(val) {
				this.showDrawer = val;
			}
		}
	}
</script>
## Drawer 抽屉

### 引入

```javascript
import { drawer } from '@58fe/p5';
```

### 基本用法

:::demo 

```html
<btn @click="showDrawer=true, direction='right'">点击打开右侧抽屉</btn>
<btn @click="showDrawer=true, direction='left'">点击打开左侧抽屉</btn>
<btn @click="showDrawer=true, direction='top'">点击打开顶部抽屉</btn>
<btn @click="showDrawer=true, direction='bottom'">点击打开底部抽屉</btn>

<drawer v-model="showDrawer" :direction="direction"></drawer>
<script>
	module.exports = {
		data() {
			return {
				showDrawer: false,
				direction: 'right'
			}
		},
		methods: {
			input(val) {
				this.showDrawer = val;
			}
		}
	}
</script>
```

:::


### 参数

| 参数         | 说明           | 类型                | 可选值       | 默认值  |
| ------------ | -------------- | ------------------- | ------------ | ------- |
| value         | v-model 是否显示       | Boolean |  必填项          | ——      |
| direction | 抽屉方向    | String             | left/right/top/bottom          | left |