Commit e54dc74775e1a0d5d3fdbac0b34eb76c2a579104
1 parent
8a3c7282
update demo
Showing
1 changed file
with
64 additions
and
57 deletions
Show diff stats
examples/routers/drawer.vue
| ... | ... | @@ -5,65 +5,67 @@ |
| 5 | 5 | <Button @click="visible3 = true">show3</Button> |
| 6 | 6 | |
| 7 | 7 | <div style="width: 500px;height:500px;background: green;position: relative;"> |
| 8 | - <Drawer v-model="visible" title="抽屉标题" :styles="styles" :transfer="false" inner> | |
| 9 | - <p>一些内容</p> | |
| 10 | - <p>一些内容</p> | |
| 11 | - <p>一些内容</p> | |
| 12 | - <Button @click="visible2 = true">show2</Button> | |
| 13 | - <p>一些内容</p> | |
| 14 | - <p>一些内容</p> | |
| 15 | - <p>一些内容</p> | |
| 16 | - <p>一些内容</p> | |
| 17 | - <p>一些内容</p> | |
| 18 | - <p>一些内容</p> | |
| 19 | - <p>一些内容</p> | |
| 20 | - <p>一些内容</p> | |
| 21 | - <p>一些内容</p> | |
| 22 | - <p>一些内容</p> | |
| 23 | - <p>一些内容</p> | |
| 24 | - <p>一些内容</p> | |
| 25 | - <p>一些内容</p> | |
| 26 | - <p>一些内容</p> | |
| 27 | - <p>一些内容</p> | |
| 28 | - <p>一些内容</p> | |
| 29 | - <p>一些内容</p> | |
| 30 | - <p>一些内容</p> | |
| 31 | - <p>一些内容</p> | |
| 32 | - <p>一些内容</p> | |
| 33 | - <p>一些内容</p> | |
| 34 | - <p>一些内容</p> | |
| 35 | - <p>一些内容</p> | |
| 36 | - <p>一些内容</p> | |
| 37 | - <p>一些内容</p> | |
| 38 | - <p>一些内容</p> | |
| 39 | - <p>一些内容</p> | |
| 40 | - <p>一些内容</p> | |
| 41 | - <p>一些内容</p> | |
| 42 | - <p>一些内容</p> | |
| 43 | - <p>一些内容</p> | |
| 44 | - <p>一些内容</p> | |
| 45 | - <p>一些内容</p> | |
| 46 | - <p>一些内容</p> | |
| 47 | - <p>一些内容</p> | |
| 48 | - <p>一些内容</p> | |
| 49 | - <p>一些内容</p> | |
| 50 | - <p>一些内容</p> | |
| 51 | - <p>一些内容</p> | |
| 52 | - <p>一些内容</p> | |
| 53 | - <p>一些内容</p> | |
| 54 | - <p>一些内容</p> | |
| 55 | - <p>一些内容</p> | |
| 56 | - <p>一些内容</p> | |
| 57 | - <p>一些内容</p> | |
| 58 | - <p>一些内容</p> | |
| 59 | - <p>一些内容</p> | |
| 60 | - <p>一些内容</p> | |
| 61 | - <p>一些内容</p> | |
| 62 | - <p>一些内容</p> | |
| 63 | - <p>一些内容</p> | |
| 64 | - </Drawer> | |
| 8 | + | |
| 65 | 9 | </div> |
| 66 | 10 | |
| 11 | + <Drawer v-model="visible" width="70" title="抽屉标题" :styles="styles" @on-close="handleClose"> | |
| 12 | + <p>一些内容</p> | |
| 13 | + <p>一些内容</p> | |
| 14 | + <p>一些内容</p> | |
| 15 | + <Button @click="visible2 = true">show2</Button> | |
| 16 | + <p>一些内容</p> | |
| 17 | + <p>一些内容</p> | |
| 18 | + <p>一些内容</p> | |
| 19 | + <p>一些内容</p> | |
| 20 | + <p>一些内容</p> | |
| 21 | + <p>一些内容</p> | |
| 22 | + <p>一些内容</p> | |
| 23 | + <p>一些内容</p> | |
| 24 | + <p>一些内容</p> | |
| 25 | + <p>一些内容</p> | |
| 26 | + <p>一些内容</p> | |
| 27 | + <p>一些内容</p> | |
| 28 | + <p>一些内容</p> | |
| 29 | + <p>一些内容</p> | |
| 30 | + <p>一些内容</p> | |
| 31 | + <p>一些内容</p> | |
| 32 | + <p>一些内容</p> | |
| 33 | + <p>一些内容</p> | |
| 34 | + <p>一些内容</p> | |
| 35 | + <p>一些内容</p> | |
| 36 | + <p>一些内容</p> | |
| 37 | + <p>一些内容</p> | |
| 38 | + <p>一些内容</p> | |
| 39 | + <p>一些内容</p> | |
| 40 | + <p>一些内容</p> | |
| 41 | + <p>一些内容</p> | |
| 42 | + <p>一些内容</p> | |
| 43 | + <p>一些内容</p> | |
| 44 | + <p>一些内容</p> | |
| 45 | + <p>一些内容</p> | |
| 46 | + <p>一些内容</p> | |
| 47 | + <p>一些内容</p> | |
| 48 | + <p>一些内容</p> | |
| 49 | + <p>一些内容</p> | |
| 50 | + <p>一些内容</p> | |
| 51 | + <p>一些内容</p> | |
| 52 | + <p>一些内容</p> | |
| 53 | + <p>一些内容</p> | |
| 54 | + <p>一些内容</p> | |
| 55 | + <p>一些内容</p> | |
| 56 | + <p>一些内容</p> | |
| 57 | + <p>一些内容</p> | |
| 58 | + <p>一些内容</p> | |
| 59 | + <p>一些内容</p> | |
| 60 | + <p>一些内容</p> | |
| 61 | + <p>一些内容</p> | |
| 62 | + <p>一些内容</p> | |
| 63 | + <p>一些内容</p> | |
| 64 | + <p>一些内容</p> | |
| 65 | + <p>一些内容</p> | |
| 66 | + <p>一些内容</p> | |
| 67 | + </Drawer> | |
| 68 | + | |
| 67 | 69 | |
| 68 | 70 | <Drawer v-model="visible2" title="抽屉标题" placement="right"> |
| 69 | 71 | <p>一些内容</p> |
| ... | ... | @@ -201,6 +203,11 @@ |
| 201 | 203 | backgroundColor: 'rgba(255,0,255,0.5)' |
| 202 | 204 | } |
| 203 | 205 | }; |
| 206 | + }, | |
| 207 | + methods: { | |
| 208 | + handleClose () { | |
| 209 | + this.$Message.info('关闭了'); | |
| 210 | + } | |
| 204 | 211 | } |
| 205 | 212 | }; |
| 206 | 213 | </script> | ... | ... |