Merge pull request #37 from iview/2.0

update
This commit is contained in:
yangdan8 2019-09-30 12:38:17 +08:00 committed by GitHub
commit 64cc4be670
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 215 additions and 165 deletions

View file

@ -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() {
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>-->

View file

@ -55,22 +55,40 @@
<!-- }-->
<!-- }-->
<!--</script>-->
<!--<template>-->
<!-- <div>-->
<!-- <Button @click="showSecond = !showSecond">change</Button>-->
<!-- <Tabs value="name1">-->
<!-- <TabPane label="标签一" name="name1" :index="1">标签一的内容</TabPane>-->
<!-- <TabPane label="标签二" name="name2" :index="2" v-if="showSecond">标签二的内容</TabPane>-->
<!-- <TabPane label="标签三" name="name3" :index="3">标签三的内容</TabPane>-->
<!-- </Tabs>-->
<!-- </div>-->
<!--</template>-->
<!--<script>-->
<!-- export default {-->
<!-- data () {-->
<!-- return {-->
<!-- showSecond: false-->
<!-- }-->
<!-- }-->
<!-- }-->
<!--</script>-->
<template>
<div>
<Button @click="showSecond = !showSecond">change</Button>
<Tabs value="name1">
<TabPane label="标签一" name="name1" :index="1">标签一的内容</TabPane>
<TabPane label="标签二" name="name2" :index="2" v-if="showSecond">标签二的内容</TabPane>
<TabPane label="标签三" name="name3" :index="3">标签三的内容</TabPane>
<Tabs>
<TabPane label="macOS" icon="logo-apple">
<Tabs>
<TabPane label="macOS" icon="logo-apple">标签一的内容</TabPane>
<TabPane label="Windows" icon="logo-windows">标签二的内容</TabPane>
<TabPane label="Linux" icon="logo-tux">标签三的内容</TabPane>
</Tabs>
</TabPane>
<TabPane label="Windows" icon="logo-windows">标签二的内容</TabPane>
<TabPane label="Linux" icon="logo-tux">标签三的内容</TabPane>
</Tabs>
</div>
</template>
<script>
export default {
data () {
return {
showSecond: false
}
}
}
</script>

View file

@ -42,13 +42,14 @@
methods: {
setActive () {
const activeKey = this.getActiveKey();
this.$nextTick(() => {
this.$children.forEach((child, index) => {
const name = child.name || index.toString();
child.isActive = activeKey.indexOf(name) > -1;
child.index = index;
});
});
},
getActiveKey () {
let activeKey = this.currentValue || [];

View file

@ -184,7 +184,9 @@ Modal.newInstance = properties => {
},
destroy () {
this.$destroy();
if( this.$el ){
document.body.removeChild(this.$el);
}
this.onRemove();
},
onOk () {},

View file

@ -217,7 +217,7 @@
if (item.tab === this.name) {
TabPanes.push(item);
}
} else {
}else if (this.$children.includes(item)) { // #6279 #6299
TabPanes.push(item);
}
});

2
types/form.d.ts vendored
View file

@ -35,7 +35,7 @@ export declare class Form extends Vue {
/**
* Boolean
*/
validate(callback?: (valid?: boolean) => void): void;
validate(callback?: (valid?: boolean) => void): Promise<boolean>;
/**
* 1 prop2
*/