|
|
@ -1,6 +1,6 @@ |
|
|
<template> |
|
|
<template> |
|
|
<view class="long-press-menu none-pointer-events"> |
|
|
<view class="long-press-menu none-pointer-events"> |
|
|
<view @longpress.stop="onLongPress($event)" @touchmove="onTouchMove" @touchend="onTouchEnd"> |
|
|
<view @longpress.prevent.stop="onLongPress($event)" @touchmove="onTouchMove" @touchend="onTouchEnd"> |
|
|
<slot></slot> |
|
|
<slot></slot> |
|
|
</view> |
|
|
</view> |
|
|
<view v-if="isShowMenu" class="menu-mask" @touchstart="onClose()" @contextmenu.prevent=""></view> |
|
|
<view v-if="isShowMenu" class="menu-mask" @touchstart="onClose()" @contextmenu.prevent=""></view> |
|
|
@ -39,9 +39,9 @@ export default { |
|
|
let style = ""; |
|
|
let style = ""; |
|
|
/* 因 非H5端不兼容 style 属性绑定 Object ,所以拼接字符 */ |
|
|
/* 因 非H5端不兼容 style 属性绑定 Object ,所以拼接字符 */ |
|
|
if (touches.clientY > (res.windowHeight / 2)) { |
|
|
if (touches.clientY > (res.windowHeight / 2)) { |
|
|
style = `bottom:${res.windowHeight - touches.clientY}px;`; |
|
|
style = `bottom:${res.windowHeight - touches.clientY + 20}px;`; |
|
|
} else { |
|
|
} else { |
|
|
style = `top:${touches.clientY}px;`; |
|
|
style = `top:${touches.clientY + 20}px;`; |
|
|
} |
|
|
} |
|
|
if (touches.clientX > (res.windowWidth / 2)) { |
|
|
if (touches.clientX > (res.windowWidth / 2)) { |
|
|
style += `right:${res.windowWidth - touches.clientX}px;`; |
|
|
style += `right:${res.windowWidth - touches.clientX}px;`; |
|
|
@ -53,12 +53,18 @@ export default { |
|
|
this.$nextTick(() => { |
|
|
this.$nextTick(() => { |
|
|
this.isShowMenu = true; |
|
|
this.isShowMenu = true; |
|
|
}); |
|
|
}); |
|
|
|
|
|
this.menuTouch = touches |
|
|
} |
|
|
} |
|
|
}) |
|
|
}) |
|
|
}, |
|
|
}, |
|
|
onTouchMove() { |
|
|
onTouchMove() { |
|
|
this.onClose(); |
|
|
|
|
|
this.isTouchMove = true; |
|
|
this.isTouchMove = true; |
|
|
|
|
|
let touches = e.touches[0]; |
|
|
|
|
|
// 屏幕拖动大于50px时,取消菜单 |
|
|
|
|
|
if (Math.abs(touches.clientX - this.menuTouch.clientX) > 50 || |
|
|
|
|
|
Math.abs(touches.clientY - this.menuTouch.clientY) > 50) { |
|
|
|
|
|
this.onClose(); |
|
|
|
|
|
} |
|
|
}, |
|
|
}, |
|
|
onTouchEnd() { |
|
|
onTouchEnd() { |
|
|
this.isTouchMove = false; |
|
|
this.isTouchMove = false; |
|
|
|