fixed #505
This commit is contained in:
parent
c2db4f928c
commit
672a2805ef
2 changed files with 28 additions and 36 deletions
|
@ -1,45 +1,31 @@
|
|||
<template>
|
||||
<div>
|
||||
<Button @click="confirm">标准</Button>
|
||||
<Button @click="custom">自定义按钮文字</Button>
|
||||
<Button @click="async">异步关闭</Button>
|
||||
<Button type="primary" @click="modal1 = true">显示对话框</Button>
|
||||
<Modal
|
||||
v-model="modal1"
|
||||
title="普通的Modal对话框标题"
|
||||
:transition-names="['slide-up', 'ease']"
|
||||
@on-ok="ok"
|
||||
@on-cancel="cancel">
|
||||
<p>对话框内容</p>
|
||||
<p>对话框内容</p>
|
||||
<p>对话框内容</p>
|
||||
</Modal>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
modal1: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
confirm () {
|
||||
this.$Modal.confirm({
|
||||
title: '确认对话框标题',
|
||||
content: '<p>一些对话框内容</p><p>一些对话框内容</p>',
|
||||
onOk: () => {
|
||||
this.$Message.info('点击了确定');
|
||||
},
|
||||
onCancel: () => {
|
||||
this.$Message.info('点击了取消');
|
||||
}
|
||||
});
|
||||
ok () {
|
||||
this.$Message.info('点击了确定');
|
||||
},
|
||||
custom () {
|
||||
this.$Modal.confirm({
|
||||
title: '确认对话框标题',
|
||||
content: '<p>一些对话框内容</p><p>一些对话框内容</p>',
|
||||
okText: 'OK',
|
||||
cancelText: 'Cancel'
|
||||
});
|
||||
},
|
||||
async () {
|
||||
this.$Modal.confirm({
|
||||
title: '确认对话框标题',
|
||||
content: '<p>对话框将在 2秒 后关闭</p>',
|
||||
loading: true,
|
||||
onOk: () => {
|
||||
setTimeout(() => {
|
||||
this.$Modal.remove();
|
||||
this.$Message.info('异步关闭了对话框');
|
||||
}, 2000);
|
||||
}
|
||||
});
|
||||
cancel () {
|
||||
this.$Message.info('点击了取消');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,10 +1,10 @@
|
|||
<template>
|
||||
<span>
|
||||
<transition name="fade">
|
||||
<transition :name="transitionNames[1]">
|
||||
<div :class="maskClasses" v-show="visible" @click="mask"></div>
|
||||
</transition>
|
||||
<div :class="wrapClasses" @click="handleWrapClick">
|
||||
<transition name="ease">
|
||||
<transition :name="transitionNames[0]">
|
||||
<div :class="classes" :style="mainStyles" v-show="visible">
|
||||
<div :class="[prefixCls + '-content']">
|
||||
<a :class="[prefixCls + '-close']" v-if="closable" @click="close">
|
||||
|
@ -82,6 +82,12 @@
|
|||
scrollable: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
transitionNames: {
|
||||
type: Array,
|
||||
default () {
|
||||
return ['ease', 'fade'];
|
||||
}
|
||||
}
|
||||
},
|
||||
data () {
|
||||
|
|
Loading…
Add table
Reference in a new issue