mirror of
https://github.com/tenrok/vue2-datepicker.git
synced 2026-06-24 00:10:36 +03:00
fix: compatible with mobile click events (#334)
This commit is contained in:
+15
-8
@@ -1,6 +1,8 @@
|
|||||||
<template>
|
<template>
|
||||||
<div
|
<div
|
||||||
class="mx-datepicker"
|
class="mx-datepicker"
|
||||||
|
@mousedown="showPopup"
|
||||||
|
@touchstart="showPopup"
|
||||||
:class="{
|
:class="{
|
||||||
'mx-datepicker-range': range,
|
'mx-datepicker-range': range,
|
||||||
'disabled': disabled
|
'disabled': disabled
|
||||||
@@ -9,8 +11,7 @@
|
|||||||
'width': computedWidth
|
'width': computedWidth
|
||||||
}"
|
}"
|
||||||
>
|
>
|
||||||
<div class="mx-input-wrapper"
|
<div class="mx-input-wrapper">
|
||||||
@click.stop="showPopup">
|
|
||||||
<input
|
<input
|
||||||
:class="inputClass"
|
:class="inputClass"
|
||||||
:name="inputName"
|
:name="inputName"
|
||||||
@@ -30,7 +31,7 @@
|
|||||||
<span
|
<span
|
||||||
v-if="showClearIcon"
|
v-if="showClearIcon"
|
||||||
class="mx-input-append mx-clear-wrapper"
|
class="mx-input-append mx-clear-wrapper"
|
||||||
@click.stop="clearDate">
|
@mousedown.stop="clearDate">
|
||||||
<slot name="mx-clear-icon">
|
<slot name="mx-clear-icon">
|
||||||
<i class="mx-input-icon mx-clear-icon"></i>
|
<i class="mx-input-icon mx-clear-icon"></i>
|
||||||
</slot>
|
</slot>
|
||||||
@@ -362,11 +363,17 @@ export default {
|
|||||||
) {
|
) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
this.closePopup()
|
|
||||||
mousedownTarget = null
|
mousedownTarget = null
|
||||||
|
this.closePopup()
|
||||||
}
|
}
|
||||||
document.addEventListener('mousedown', this._bindDocmentMousedown)
|
this._startEvt = 'mousedown'
|
||||||
document.addEventListener('mouseup', this._bindDocumentMouseup)
|
this._endEvt = 'mouseup'
|
||||||
|
if ('ontouchend' in document) {
|
||||||
|
this._startEvt = 'touchstart'
|
||||||
|
this._endEvt = 'touchend'
|
||||||
|
}
|
||||||
|
document.addEventListener(this._startEvt, this._bindDocmentMousedown)
|
||||||
|
document.addEventListener(this._endEvt, this._bindDocumentMouseup)
|
||||||
|
|
||||||
this._displayPopup = throttle(() => {
|
this._displayPopup = throttle(() => {
|
||||||
if (this.popupVisible) {
|
if (this.popupVisible) {
|
||||||
@@ -380,8 +387,8 @@ export default {
|
|||||||
if (this.popupElm && this.popupElm.parentNode === document.body) {
|
if (this.popupElm && this.popupElm.parentNode === document.body) {
|
||||||
document.body.removeChild(this.popupElm)
|
document.body.removeChild(this.popupElm)
|
||||||
}
|
}
|
||||||
document.removeEventListener('mousedown', this._bindDocmentMousedown)
|
document.removeEventListener(this._startEvt, this._bindDocmentMousedown)
|
||||||
document.removeEventListener('mouseup', this._bindDocumentMouseup)
|
document.removeEventListener(this._endEvt, this._bindDocumentMouseup)
|
||||||
window.removeEventListener('resize', this._displayPopup)
|
window.removeEventListener('resize', this._displayPopup)
|
||||||
window.removeEventListener('scroll', this._displayPopup)
|
window.removeEventListener('scroll', this._displayPopup)
|
||||||
},
|
},
|
||||||
|
|||||||
Reference in New Issue
Block a user