chenhaodong / mew-iview

Commit e54dc74775e1a0d5d3fdbac0b34eb76c2a579104

Authored by 梁灏
1 parent 8a3c7282

update demo

Showing 1 changed file with 64 additions and 57 deletions   Show diff stats
Inline Side-by-side
examples/routers/drawer.vue
  Show/Hide comments   View file @e54dc74
... ... @@ -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>
... ...