From b8b4a0d1398135411be35a346db6a761f2751259 Mon Sep 17 00:00:00 2001 From: Telanx <1241818518@qq.com> Date: Mon, 17 Oct 2016 11:42:02 +0800 Subject: [PATCH 1/2] Update vue-swiper.vue MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 修复vue-swiper在手机上滑动小问题 --- src/vue-swiper.vue | 25 ++++++++++++++++++++++--- 1 file changed, 22 insertions(+), 3 deletions(-) diff --git a/src/vue-swiper.vue b/src/vue-swiper.vue index 9496f53..42df6a6 100644 --- a/src/vue-swiper.vue +++ b/src/vue-swiper.vue @@ -67,8 +67,10 @@ translateY: 0, startTranslate: 0, delta: 0, + deltaXY: { }, dragging: false, startPos: null, + startPosXY: null, transitioning: false, slideEls: [], translateOffset: 0, @@ -139,7 +141,12 @@ }, _onTouchStart(e) { this.startPos = this._getTouchPos(e); + this.startPosXY = this.getTouchPosXY(e); this.delta = 0; + this.deltaXY = { + pageX: 0, + pageY: 0 + }; this.startTranslate = this._getTranslateOfPage(this.currentPage); this.startTime = new Date().getTime(); this.dragging = true; @@ -151,16 +158,25 @@ document.addEventListener('mouseup', this._onTouchEnd, false); }, _onTouchMove(e) { - this.delta = this._getTouchPos(e) - this.startPos; - + //this.delta = this._getTouchPos(e) - this.startPos; if (!this.performanceMode) { this._setTranslate(this.startTranslate + this.delta); this.$emit('slider-move', this._getTranslate()); } - if (this.isVertical() || this.isHorizontal() && Math.abs(this.delta) > 0) { + this.deltaXY = { + pageX: this._getTouchPosXY(e).pageX - this.startPosXY.pageX, + pageY: this._getTouchPosXY(e).pageY - this.startPosXY.pageY + }; + var key = this.isVertical() ? 'pageY' : 'pageX'; + var _key = this.isVertical() ? 'pageX' : 'pageY'; + if (Math.abs(this.deltaXY[key]) > Math.abs(this.deltaXY[_key])) { e.preventDefault(); } + + //if (this.isVertical() || this.isHorizontal() && Math.abs(this.delta) > 0) { + // e.preventDefault(); + //} }, _onTouchEnd(e) { this.dragging = false; @@ -200,6 +216,9 @@ var key = this.isHorizontal() ? 'pageX' : 'pageY'; return e.changedTouches ? e.changedTouches[0][key] : e[key]; }, + _getTouchPosXY(e) { + return e.changedTouches ? e.changedTouches[0] : e; + }, _onTransitionStart() { this.transitioning = true; this.transitionDuration = this.speed; From 18588bb49a0ec40861465c3eb426c8cb91b5b7ea Mon Sep 17 00:00:00 2001 From: Telanx <1241818518@qq.com> Date: Mon, 17 Oct 2016 11:54:05 +0800 Subject: [PATCH 2/2] Update vue-swiper.vue --- src/vue-swiper.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/vue-swiper.vue b/src/vue-swiper.vue index 42df6a6..9ca621c 100644 --- a/src/vue-swiper.vue +++ b/src/vue-swiper.vue @@ -158,7 +158,7 @@ document.addEventListener('mouseup', this._onTouchEnd, false); }, _onTouchMove(e) { - //this.delta = this._getTouchPos(e) - this.startPos; + this.delta = this._getTouchPos(e) - this.startPos; if (!this.performanceMode) { this._setTranslate(this.startTranslate + this.delta); this.$emit('slider-move', this._getTranslate());