github
/
element
mirror of https://github.com/ElemeFE/element
1
0
Fork 0
Code Issues Releases Wiki Activity

Slider: avoid clicking triggering right after dragend

pull/1559/head
Leopoldthecoder 2016-12-06 16:55:42 +08:00
parent 6e618b4c6d
commit 1c750dcec7
1 changed files with 8 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
packages/slider/src/main.vue
View File

@ -157,7 +157,7 @@
}, },
onSliderClick(event) { onSliderClick(event) {
if (this.disabled) return; if (this.disabled || this.dragging) return;
const sliderOffsetLeft = this.$refs.slider.getBoundingClientRect().left; const sliderOffsetLeft = this.$refs.slider.getBoundingClientRect().left;
this.setPosition((event.clientX - sliderOffsetLeft) / this.$sliderWidth * 100); this.setPosition((event.clientX - sliderOffsetLeft) / this.$sliderWidth * 100);
}, },
@ -189,7 +189,13 @@
onDragEnd() { onDragEnd() {
if (this.dragging) { if (this.dragging) {
this.dragging = false; /*
* 防止在 mouseup 后立即触发 click，导致滑块有几率产生一小段位移
* 不使用 preventDefault 是因为 mouseup 和 click 没有注册在同一个 DOM 上
*/
setTimeout(() => {
this.dragging = false;
}, 0);
this.$refs.tooltip.showPopper = false; this.$refs.tooltip.showPopper = false;
this.setPosition(this.newPos); this.setPosition(this.newPos);
window.removeEventListener('mousemove', this.onDragging); window.removeEventListener('mousemove', this.onDragging);