Commit e54dc74775e1a0d5d3fdbac0b34eb76c2a579104

Authored by 梁灏
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,65 +5,67 @@
5 <Button @click="visible3 = true">show3</Button> 5 <Button @click="visible3 = true">show3</Button>
6 6
7 <div style="width: 500px;height:500px;background: green;position: relative;"> 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 </div> 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 <Drawer v-model="visible2" title="抽屉标题" placement="right"> 70 <Drawer v-model="visible2" title="抽屉标题" placement="right">
69 <p>一些内容</p> 71 <p>一些内容</p>
@@ -201,6 +203,11 @@ @@ -201,6 +203,11 @@
201 backgroundColor: 'rgba(255,0,255,0.5)' 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 </script> 213 </script>