[Popover]: Open Delay Attribute (#5842)

* [Popover]: Open Delay Attribute

* Update main.vue

* fix openDelay

* Update popover.md
pull/5861/head
Kaung Myat Lwin 2017-07-13 18:11:44 +06:30 committed by 杨奕
parent 0c2248b013
commit 007d1fb1ad
2 changed files with 12 additions and 1 deletions

View File

@ -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 |

View File

@ -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() {
if (this.openDelay) {
setTimeout(() => {
this.showPopper = true; this.showPopper = true;
}, this.openDelay);
} else {
this.showPopper = true;
}
clearTimeout(this._timer); clearTimeout(this._timer);
}, },
handleMouseLeave() { handleMouseLeave() {