feat(ImagePreview): adjust double-click interval to 250ms (#6136)

This commit is contained in:
neverland 2020-04-26 14:00:41 +08:00 committed by GitHub
parent 3cd7128efd
commit 50a4dc681c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 6 additions and 4 deletions

View File

@ -15,6 +15,7 @@ import Loading from '../loading';
import SwipeItem from '../swipe-item';
const [createComponent, bem] = createNamespace('image-preview');
const DOUBLE_CLICK_INTERVAL = 250;
function getDistance(touches) {
return Math.sqrt(
@ -161,14 +162,15 @@ export default createComponent({
const deltaTime = new Date() - this.touchStartTime;
const { offsetX = 0, offsetY = 0 } = this.$refs.swipe || {};
console.log('deltaTime', deltaTime);
// prevent long tap to close component
if (deltaTime < 300 && offsetX < 10 && offsetY < 10) {
if (deltaTime < DOUBLE_CLICK_INTERVAL && offsetX < 10 && offsetY < 10) {
if (!this.doubleClickTimer) {
this.doubleClickTimer = setTimeout(() => {
this.emitClose();
this.doubleClickTimer = null;
}, 300);
}, DOUBLE_CLICK_INTERVAL);
} else {
clearTimeout(this.doubleClickTimer);
this.doubleClickTimer = null;

View File

@ -32,7 +32,7 @@ test('render image', async () => {
expect(wrapper.emitted('input')).toBeFalsy();
triggerDrag(swipe, 0, 0);
await later(300);
await later(250);
expect(wrapper.emitted('input')[0][0]).toBeFalsy();
expect(wrapper.emitted('change')[0][0]).toEqual(2);
@ -94,7 +94,7 @@ test('async close prop', async () => {
// should not emit input or close event when tapped
triggerDrag(swipe, 0, 0);
await later(300);
await later(250);
expect(wrapper.emitted('input')).toBeFalsy();
expect(wrapper.emitted('close')).toBeFalsy();