bug fixed #6305
This commit is contained in:
mo.duan
parent
551c730771
commit
6b0409622b
2 changed files with 176 additions and 145 deletions
|
|
@ -1,157 +1,186 @@
|
|||
<template>
|
||||
<div>
|
||||
<Button type="primary" @click="modal1 = true">Display dialog box</Button>
|
||||
<Button type="primary" @click="modal2 = true">Display dialog box</Button>
|
||||
<Modal v-model="modal2" draggable title="Common Modal dialog box title"
|
||||
@on-ok="ok"
|
||||
@on-cancel="cancel" :styles="{top: '300px', left: '100px'}">
|
||||
<p>2123</p>
|
||||
</Modal>
|
||||
<Modal
|
||||
v-model="modal1"
|
||||
title="Common Modal dialog box title"
|
||||
@on-ok="ok"
|
||||
@on-cancel="cancel">
|
||||
<p>Content of dialog</p>
|
||||
<p>Content of dialog</p>
|
||||
<p>Content of dialog</p>
|
||||
<Button @click="openMessage">Message</Button>
|
||||
<Select v-model="model1" style="width:200px" :transfer="false">
|
||||
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
|
||||
</Select>
|
||||
<Select v-model="model1" style="width:200px" :transfer="true">
|
||||
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
|
||||
</Select>
|
||||
<Dropdown transfer>
|
||||
<a href="javascript:void(0)">
|
||||
下拉菜单
|
||||
<Icon type="ios-arrow-down"></Icon>
|
||||
</a>
|
||||
<DropdownMenu slot="list">
|
||||
<DropdownItem>驴打滚</DropdownItem>
|
||||
<DropdownItem>炸酱面</DropdownItem>
|
||||
<DropdownItem disabled>豆汁儿</DropdownItem>
|
||||
<DropdownItem>冰糖葫芦</DropdownItem>
|
||||
<DropdownItem divided>北京烤鸭</DropdownItem>
|
||||
</DropdownMenu>
|
||||
</Dropdown>
|
||||
<DatePicker type="date" placeholder="Select date" style="width: 200px" transfer></DatePicker>
|
||||
<Cascader :data="data" v-model="value1" transfer></Cascader>
|
||||
<Tooltip content="Here is the prompt text" transfer>
|
||||
A balloon appears when the mouse passes over this text
|
||||
</Tooltip>
|
||||
<Poptip trigger="hover" title="Title" content="content" transfer>
|
||||
<Button>Hover</Button>
|
||||
</Poptip>
|
||||
<Button type="primary" @click="handleSpinShow">整页显示，3秒后关闭</Button>
|
||||
</Modal>
|
||||
<Select v-model="model1" style="width:200px" :transfer="false">
|
||||
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
|
||||
</Select>
|
||||
<Select v-model="model1" style="width:200px" :transfer="true">
|
||||
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
|
||||
</Select>
|
||||
<Button @click="test">test</Button>
|
||||
<p>执行次数{{num}}</p>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data () {
|
||||
data() {
|
||||
return {
|
||||
modal1: false,
|
||||
modal2: false,
|
||||
cityList: [
|
||||
{
|
||||
value: 'New York',
|
||||
label: 'New York'
|
||||
},
|
||||
{
|
||||
value: 'London',
|
||||
label: 'London'
|
||||
},
|
||||
{
|
||||
value: 'Sydney',
|
||||
label: 'Sydney'
|
||||
},
|
||||
{
|
||||
value: 'Ottawa',
|
||||
label: 'Ottawa'
|
||||
},
|
||||
{
|
||||
value: 'Paris',
|
||||
label: 'Paris'
|
||||
},
|
||||
{
|
||||
value: 'Canberra',
|
||||
label: 'Canberra'
|
||||
}
|
||||
],
|
||||
model1: '',
|
||||
value1: [],
|
||||
data: [{
|
||||
value: 'beijing',
|
||||
label: '北京',
|
||||
children: [
|
||||
{
|
||||
value: 'gugong',
|
||||
label: '故宫'
|
||||
},
|
||||
{
|
||||
value: 'tiantan',
|
||||
label: '天坛'
|
||||
},
|
||||
{
|
||||
value: 'wangfujing',
|
||||
label: '王府井'
|
||||
}
|
||||
]
|
||||
}, {
|
||||
value: 'jiangsu',
|
||||
label: '江苏',
|
||||
children: [
|
||||
{
|
||||
value: 'nanjing',
|
||||
label: '南京',
|
||||
children: [
|
||||
{
|
||||
value: 'fuzimiao',
|
||||
label: '夫子庙',
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
value: 'suzhou',
|
||||
label: '苏州',
|
||||
children: [
|
||||
{
|
||||
value: 'zhuozhengyuan',
|
||||
label: '拙政园',
|
||||
},
|
||||
{
|
||||
value: 'shizilin',
|
||||
label: '狮子林',
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
}]
|
||||
num: 0
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
ok () {
|
||||
// this.$Message.info('Clicked ok');
|
||||
},
|
||||
cancel () {
|
||||
// this.$Message.info('Clicked cancel');
|
||||
},
|
||||
openMessage () {
|
||||
this.$Message.info({
|
||||
content: 'hello world',
|
||||
duration: 2
|
||||
});
|
||||
},
|
||||
handleSpinShow () {
|
||||
this.$Spin.show();
|
||||
},
|
||||
test() {
|
||||
this.$Modal.confirm({
|
||||
loading: true,
|
||||
onOk: () => {
|
||||
setTimeout(() => {
|
||||
this.num++
|
||||
this.$Modal.remove()
|
||||
}, 0)
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<!--<template>-->
|
||||
<!-- <div>-->
|
||||
<!-- <Button type="primary" @click="modal1 = true">Display dialog box</Button>-->
|
||||
<!-- <Button type="primary" @click="modal2 = true">Display dialog box</Button>-->
|
||||
<!-- <Modal v-model="modal2" draggable title="Common Modal dialog box title"-->
|
||||
<!-- @on-ok="ok"-->
|
||||
<!-- @on-cancel="cancel" :styles="{top: '300px', left: '100px'}">-->
|
||||
<!-- <p>2123</p>-->
|
||||
<!-- </Modal>-->
|
||||
<!-- <Modal-->
|
||||
<!-- v-model="modal1"-->
|
||||
<!-- title="Common Modal dialog box title"-->
|
||||
<!-- @on-ok="ok"-->
|
||||
<!-- @on-cancel="cancel">-->
|
||||
<!-- <p>Content of dialog</p>-->
|
||||
<!-- <p>Content of dialog</p>-->
|
||||
<!-- <p>Content of dialog</p>-->
|
||||
<!-- <Button @click="openMessage">Message</Button>-->
|
||||
<!-- <Select v-model="model1" style="width:200px" :transfer="false">-->
|
||||
<!-- <Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>-->
|
||||
<!-- </Select>-->
|
||||
<!-- <Select v-model="model1" style="width:200px" :transfer="true">-->
|
||||
<!-- <Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>-->
|
||||
<!-- </Select>-->
|
||||
<!-- <Dropdown transfer>-->
|
||||
<!-- <a href="javascript:void(0)">-->
|
||||
<!-- 下拉菜单-->
|
||||
<!-- <Icon type="ios-arrow-down"></Icon>-->
|
||||
<!-- </a>-->
|
||||
<!-- <DropdownMenu slot="list">-->
|
||||
<!-- <DropdownItem>驴打滚</DropdownItem>-->
|
||||
<!-- <DropdownItem>炸酱面</DropdownItem>-->
|
||||
<!-- <DropdownItem disabled>豆汁儿</DropdownItem>-->
|
||||
<!-- <DropdownItem>冰糖葫芦</DropdownItem>-->
|
||||
<!-- <DropdownItem divided>北京烤鸭</DropdownItem>-->
|
||||
<!-- </DropdownMenu>-->
|
||||
<!-- </Dropdown>-->
|
||||
<!-- <DatePicker type="date" placeholder="Select date" style="width: 200px" transfer></DatePicker>-->
|
||||
<!-- <Cascader :data="data" v-model="value1" transfer></Cascader>-->
|
||||
<!-- <Tooltip content="Here is the prompt text" transfer>-->
|
||||
<!-- A balloon appears when the mouse passes over this text-->
|
||||
<!-- </Tooltip>-->
|
||||
<!-- <Poptip trigger="hover" title="Title" content="content" transfer>-->
|
||||
<!-- <Button>Hover</Button>-->
|
||||
<!-- </Poptip>-->
|
||||
<!-- <Button type="primary" @click="handleSpinShow">整页显示，3秒后关闭</Button>-->
|
||||
<!-- </Modal>-->
|
||||
<!-- <Select v-model="model1" style="width:200px" :transfer="false">-->
|
||||
<!-- <Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>-->
|
||||
<!-- </Select>-->
|
||||
<!-- <Select v-model="model1" style="width:200px" :transfer="true">-->
|
||||
<!-- <Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>-->
|
||||
<!-- </Select>-->
|
||||
<!-- </div>-->
|
||||
<!--</template>-->
|
||||
<!--<script>-->
|
||||
<!-- export default {-->
|
||||
<!-- data () {-->
|
||||
<!-- return {-->
|
||||
<!-- modal1: false,-->
|
||||
<!-- modal2: false,-->
|
||||
<!-- cityList: [-->
|
||||
<!-- {-->
|
||||
<!-- value: 'New York',-->
|
||||
<!-- label: 'New York'-->
|
||||
<!-- },-->
|
||||
<!-- {-->
|
||||
<!-- value: 'London',-->
|
||||
<!-- label: 'London'-->
|
||||
<!-- },-->
|
||||
<!-- {-->
|
||||
<!-- value: 'Sydney',-->
|
||||
<!-- label: 'Sydney'-->
|
||||
<!-- },-->
|
||||
<!-- {-->
|
||||
<!-- value: 'Ottawa',-->
|
||||
<!-- label: 'Ottawa'-->
|
||||
<!-- },-->
|
||||
<!-- {-->
|
||||
<!-- value: 'Paris',-->
|
||||
<!-- label: 'Paris'-->
|
||||
<!-- },-->
|
||||
<!-- {-->
|
||||
<!-- value: 'Canberra',-->
|
||||
<!-- label: 'Canberra'-->
|
||||
<!-- }-->
|
||||
<!-- ],-->
|
||||
<!-- model1: '',-->
|
||||
<!-- value1: [],-->
|
||||
<!-- data: [{-->
|
||||
<!-- value: 'beijing',-->
|
||||
<!-- label: '北京',-->
|
||||
<!-- children: [-->
|
||||
<!-- {-->
|
||||
<!-- value: 'gugong',-->
|
||||
<!-- label: '故宫'-->
|
||||
<!-- },-->
|
||||
<!-- {-->
|
||||
<!-- value: 'tiantan',-->
|
||||
<!-- label: '天坛'-->
|
||||
<!-- },-->
|
||||
<!-- {-->
|
||||
<!-- value: 'wangfujing',-->
|
||||
<!-- label: '王府井'-->
|
||||
<!-- }-->
|
||||
<!-- ]-->
|
||||
<!-- }, {-->
|
||||
<!-- value: 'jiangsu',-->
|
||||
<!-- label: '江苏',-->
|
||||
<!-- children: [-->
|
||||
<!-- {-->
|
||||
<!-- value: 'nanjing',-->
|
||||
<!-- label: '南京',-->
|
||||
<!-- children: [-->
|
||||
<!-- {-->
|
||||
<!-- value: 'fuzimiao',-->
|
||||
<!-- label: '夫子庙',-->
|
||||
<!-- }-->
|
||||
<!-- ]-->
|
||||
<!-- },-->
|
||||
<!-- {-->
|
||||
<!-- value: 'suzhou',-->
|
||||
<!-- label: '苏州',-->
|
||||
<!-- children: [-->
|
||||
<!-- {-->
|
||||
<!-- value: 'zhuozhengyuan',-->
|
||||
<!-- label: '拙政园',-->
|
||||
<!-- },-->
|
||||
<!-- {-->
|
||||
<!-- value: 'shizilin',-->
|
||||
<!-- label: '狮子林',-->
|
||||
<!-- }-->
|
||||
<!-- ]-->
|
||||
<!-- }-->
|
||||
<!-- ],-->
|
||||
<!-- }]-->
|
||||
<!-- }-->
|
||||
<!-- },-->
|
||||
<!-- methods: {-->
|
||||
<!-- ok () {-->
|
||||
<!--// this.$Message.info('Clicked ok');-->
|
||||
<!-- },-->
|
||||
<!-- cancel () {-->
|
||||
<!--// this.$Message.info('Clicked cancel');-->
|
||||
<!-- },-->
|
||||
<!-- openMessage () {-->
|
||||
<!-- this.$Message.info({-->
|
||||
<!-- content: 'hello world',-->
|
||||
<!-- duration: 2-->
|
||||
<!-- });-->
|
||||
<!-- },-->
|
||||
<!-- handleSpinShow () {-->
|
||||
<!-- this.$Spin.show();-->
|
||||
<!-- },-->
|
||||
<!-- }-->
|
||||
<!-- }-->
|
||||
<!--</script>-->
|
||||
|
|
|
|||
|
|
@ -184,7 +184,9 @@ Modal.newInstance = properties => {
|
|||
},
|
||||
destroy () {
|
||||
this.$destroy();
|
||||
document.body.removeChild(this.$el);
|
||||
if( this.$el ){
|
||||
document.body.removeChild(this.$el);
|
||||
}
|
||||
this.onRemove();
|
||||
},
|
||||
onOk () {},
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue