Commit 4a8826fa029afc966c38c916411893ed6aaea5a0
1 parent
f308dcac
fixed #4895
Showing
2 changed files
with
32 additions
and
2 deletions
Show diff stats
examples/routers/drawer.vue
@@ -5,7 +5,7 @@ | @@ -5,7 +5,7 @@ | ||
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" placement="left" draggable inner :transfer="false" width="50" @on-resize-width="hrw" title="抽屉标题" :styles="styles" @on-close="handleClose"> | 8 | + <Drawer v-model="visible" placement="left" :before-close="handleBeforeClose" draggable inner :transfer="false" width="50" @on-resize-width="hrw" title="抽屉标题" :styles="styles" @on-close="handleClose"> |
9 | <p>一些内容</p> | 9 | <p>一些内容</p> |
10 | <p>一些内容</p> | 10 | <p>一些内容</p> |
11 | <p>一些内容</p> | 11 | <p>一些内容</p> |
@@ -209,6 +209,20 @@ | @@ -209,6 +209,20 @@ | ||
209 | }, | 209 | }, |
210 | hrw (w) { | 210 | hrw (w) { |
211 | console.log(w); | 211 | console.log(w); |
212 | + }, | ||
213 | + handleBeforeClose () { | ||
214 | + return new Promise((resolve, reject) => { | ||
215 | + this.$Modal.confirm({ | ||
216 | + title: '关闭确认', | ||
217 | + content: '您确认要关闭抽屉吗?', | ||
218 | + onOk: () => { | ||
219 | + resolve(); | ||
220 | + }, | ||
221 | + onCancel: () => { | ||
222 | + reject(); | ||
223 | + } | ||
224 | + }); | ||
225 | + }); | ||
212 | } | 226 | } |
213 | } | 227 | } |
214 | }; | 228 | }; |
src/components/drawer/drawer.vue
@@ -106,7 +106,8 @@ | @@ -106,7 +106,8 @@ | ||
106 | draggable: { | 106 | draggable: { |
107 | type: Boolean, | 107 | type: Boolean, |
108 | default: false | 108 | default: false |
109 | - } | 109 | + }, |
110 | + beforeClose: Function, | ||
110 | }, | 111 | }, |
111 | data () { | 112 | data () { |
112 | return { | 113 | return { |
@@ -176,6 +177,21 @@ | @@ -176,6 +177,21 @@ | ||
176 | }, | 177 | }, |
177 | methods: { | 178 | methods: { |
178 | close () { | 179 | close () { |
180 | + if (!this.beforeClose) { | ||
181 | + return this.handleClose(); | ||
182 | + } | ||
183 | + | ||
184 | + const before = this.beforeClose(); | ||
185 | + | ||
186 | + if (before && before.then) { | ||
187 | + before.then(() => { | ||
188 | + this.handleClose(); | ||
189 | + }); | ||
190 | + } else { | ||
191 | + this.handleClose(); | ||
192 | + } | ||
193 | + }, | ||
194 | + handleClose () { | ||
179 | this.visible = false; | 195 | this.visible = false; |
180 | this.$emit('input', false); | 196 | this.$emit('input', false); |
181 | this.$emit('on-close'); | 197 | this.$emit('on-close'); |