mirror of https://github.com/ElemeFE/element
[Popover]: Open Delay Attribute (#5842)
* [Popover]: Open Delay Attribute * Update main.vue * fix openDelay * Update popover.mdpull/5861/head
parent
0c2248b013
commit
007d1fb1ad
|
@ -233,6 +233,7 @@ Of course, you can nest other operations. It's more light-weight than using a di
|
||||||
| visible-arrow | whether a tooltip arrow is displayed or not. For more info, please refer to [Vue-popper](https://github.com/element-component/vue-popper) | boolean | — | true |
|
| visible-arrow | whether a tooltip arrow is displayed or not. For more info, please refer to [Vue-popper](https://github.com/element-component/vue-popper) | boolean | — | true |
|
||||||
| popper-options | parameters for [popper.js](https://popper.js.org/documentation.html) | object | please refer to [popper.js](https://popper.js.org/documentation.html) | `{ boundariesElement: 'body', gpuAcceleration: false }` |
|
| popper-options | parameters for [popper.js](https://popper.js.org/documentation.html) | object | please refer to [popper.js](https://popper.js.org/documentation.html) | `{ boundariesElement: 'body', gpuAcceleration: false }` |
|
||||||
| popper-class | custom class name for popover | string | — | — |
|
| popper-class | custom class name for popover | string | — | — |
|
||||||
|
| open-delay | delay of appearance when `trigger` is hover, in milliseconds | number | — | — |
|
||||||
|
|
||||||
### Slot
|
### Slot
|
||||||
| Name | Description |
|
| Name | Description |
|
||||||
|
|
|
@ -30,6 +30,10 @@ export default {
|
||||||
default: 'click',
|
default: 'click',
|
||||||
validator: value => ['click', 'focus', 'hover', 'manual'].indexOf(value) > -1
|
validator: value => ['click', 'focus', 'hover', 'manual'].indexOf(value) > -1
|
||||||
},
|
},
|
||||||
|
openDelay: {
|
||||||
|
type: Number,
|
||||||
|
default: 0
|
||||||
|
},
|
||||||
title: String,
|
title: String,
|
||||||
disabled: Boolean,
|
disabled: Boolean,
|
||||||
content: String,
|
content: String,
|
||||||
|
@ -105,7 +109,13 @@ export default {
|
||||||
this.showPopper = false;
|
this.showPopper = false;
|
||||||
},
|
},
|
||||||
handleMouseEnter() {
|
handleMouseEnter() {
|
||||||
this.showPopper = true;
|
if (this.openDelay) {
|
||||||
|
setTimeout(() => {
|
||||||
|
this.showPopper = true;
|
||||||
|
}, this.openDelay);
|
||||||
|
} else {
|
||||||
|
this.showPopper = true;
|
||||||
|
}
|
||||||
clearTimeout(this._timer);
|
clearTimeout(this._timer);
|
||||||
},
|
},
|
||||||
handleMouseLeave() {
|
handleMouseLeave() {
|
||||||
|
|
Loading…
Reference in New Issue