add capture prop

This commit is contained in:
梁灏 2019-09-17 18:39:27 +08:00
parent 6b827bb4be
commit d29a51230e
6 changed files with 51 additions and 88 deletions

View file

@ -11,7 +11,8 @@ import locale from '../src/locale/lang/zh-CN';
Vue.use(VueRouter);
Vue.use(iView, {
locale
locale,
capture: true
});
// 开启debug模式

View file

@ -1,87 +1,21 @@
<template>
<div style="margin: 200px">
<Tabs value="name1">
<TabPane label="标签一" name="name1">
<!-- <div style="width: 200px;height:300px;overflow: auto;">
<Poptip title="提示标题" content="标签一的内容" placement="left" transfer >
<Button id="aaa">左边</Button>
</Poptip>
<Poptip title="提示标题" content="标签一的内容" placement="right" transfer>
<Button id="aaa">右边</Button>
</Poptip>
<Poptip title="提示标题" content="标签一的内容" placement="top" transfer>
<Button id="aaa">上边</Button>
</Poptip>
<Poptip title="提示标题" content="标签一的内容" placement="bottom" transfer>
<Button id="aaa">下边</Button>
</Poptip>
</div> -->
<div>
<Poptip title="提示标题" content="标签一的内容">
<Button id="aaa">点击显示</Button>
<div slot="content">
<Button @click='loadData(15)'>15条数据</Button>
<Button @click='loadData(10)'>10条数据</Button>
<Button @click='loadData(5)'>5条数据</Button>
<Button @click='loadData(3)'>3条数据</Button>
<Table :columns='columns1' :data='data1'>
</Table>
</div>
</Poptip>
</div>
</TabPane>
<TabPane label="标签二" name="name2">标签二的内容</TabPane>
</Tabs>
<div>
<Poptip trigger="hover" title="Title" content="content">
<Button>Hover</Button>
</Poptip>
<Poptip title="Title" content="content">
<Button>Click</Button>
</Poptip>
<Poptip trigger="focus" title="Title" content="content">
<Button>Focus</Button>
</Poptip>
<Poptip trigger="focus" title="Title" content="content">
<Input placeholder="Input focus" />
</Poptip>
</div>
</template>
<script>
export default {
data () {
return {
options: {
},
columns1:[
{
title: 'Data1',
key: 'data1',
width: 100,
},
{
title: 'Data2',
key: 'data2',
width: 100
},
{
title: 'Data3',
key: 'data3',
width: 100
},
{
title: 'Data4',
key: 'data4',
width: 100
}
],
data1:[],
}
},
created(){
this.loadData(5);
},
methods:{
loadData(num){
let data = [];
for (let i=0; i<num; i++) {
data.push({
data1:Math.random()*1000000,
data2:Math.random()*100000000,
data3:Math.random()*10000000000,
data4:Math.random()*1000000000000,
})
}
this.data1 = data
},
}
}
</script>

View file

@ -1,5 +1,5 @@
<template>
<div :class="classes" v-click-outside="handleClose">
<div :class="classes" v-click-outside:[capture]="handleClose">
<div :class="[prefixCls + '-rel']" @click="toggleOpen" ref="reference">
<input type="hidden" :name="name" :value="currentValue">
<slot>
@ -58,7 +58,7 @@
import Drop from '../select/dropdown.vue';
import Icon from '../icon/icon.vue';
import Caspanel from './caspanel.vue';
import {directive as clickOutside} from 'v-click-outside-x';
import {directive as clickOutside} from '../../directives/v-click-outside-x';
import TransferDom from '../../directives/transfer-dom';
import { oneOf } from '../../utils/assist';
import Emitter from '../../mixins/emitter';
@ -142,6 +142,13 @@
},
elementId: {
type: String
},
// 4.0.0
capture: {
type: Boolean,
default () {
return !this.$IVIEW ? true : this.$IVIEW.capture;
}
}
},
data () {

View file

@ -1,6 +1,6 @@
<template>
<div
v-click-outside="handleClose"
v-click-outside:[capture]="handleClose"
:class="classes">
<div
ref="reference"
@ -116,7 +116,7 @@
<script>
import tinycolor from 'tinycolor2';
import {directive as clickOutside} from 'v-click-outside-x';
import {directive as clickOutside} from '../../directives/v-click-outside-x';
import TransferDom from '../../directives/transfer-dom';
import Drop from '../../components/select/dropdown.vue';
import RecommendColors from './recommend-colors.vue';
@ -222,6 +222,13 @@ export default {
type: Boolean,
default: true
},
// 4.0.0
capture: {
type: Boolean,
default () {
return !this.$IVIEW ? true : this.$IVIEW.capture;
}
}
},
data() {

View file

@ -1,7 +1,7 @@
<template>
<div
:class="[prefixCls]"
v-click-outside="onClickoutside"
v-click-outside:[capture]="onClickoutside"
@mouseenter="handleMouseenter"
@mouseleave="handleMouseleave">
<div :class="relClasses" ref="reference" @click="handleClick" @contextmenu.prevent="handleRightClick"><slot></slot></div>
@ -21,7 +21,7 @@
</template>
<script>
import Drop from '../select/dropdown.vue';
import {directive as clickOutside} from 'v-click-outside-x';
import {directive as clickOutside} from '../../directives/v-click-outside-x';
import TransferDom from '../../directives/transfer-dom';
import { oneOf, findComponentUpward } from '../../utils/assist';
@ -61,6 +61,13 @@
type: Boolean,
default: false
},
// 4.0.0
capture: {
type: Boolean,
default () {
return !this.$IVIEW ? true : this.$IVIEW.capture;
}
}
},
computed: {
transition () {

View file

@ -3,7 +3,7 @@
:class="classes"
@mouseenter="handleMouseenter"
@mouseleave="handleMouseleave"
v-click-outside="handleClose">
v-click-outside:[capture]="handleClose">
<div
:class="[prefixCls + '-rel']"
ref="reference"
@ -49,7 +49,7 @@
<script>
import Popper from '../base/popper';
import iButton from '../button/button.vue';
import {directive as clickOutside} from 'v-click-outside-x';
import {directive as clickOutside} from '../../directives/v-click-outside-x';
import TransferDom from '../../directives/transfer-dom';
import { oneOf } from '../../utils/assist';
import { transferIndex, transferIncrease } from '../../utils/transfer-queue';
@ -116,6 +116,13 @@
disabled: {
type: Boolean,
default: false
},
// 4.0.0
capture: {
type: Boolean,
default () {
return !this.$IVIEW ? true : this.$IVIEW.capture;
}
}
},
data () {