Vue开发h5中的按钮拖拽+点击事件

<div class="floatBtn" @touchstart.prevent="move">常购</div>

// 悬浮按钮的拖拽事件,合并单击事件行为至此
        move(e){
            let  startTime = (new Date()).getTime();//获取当前按下时的时间
            let odiv = e.target;//获取目标元素
            const maxLeft = window.outerWidth - 40 //left最大值,40是目标元素的宽
            const maxTop = window.outerHeight - 40 //top最大值，40是目标元素的高
            let t = e.targetTouches[0]
            let x = t.clientX - t.target.offsetLeft //触碰点当前距离事件源的左距
            let y = t.clientY - t.target.offsetTop //触碰点当前距离事件源的上距
            document.ontouchmove = (e)=>{//鼠标按下并移动的事件
                //用鼠标的位置减去鼠标相对元素的位置(默认20)，得到元素的位置
                const touch =  e.changedTouches[0]
                let left =  touch.clientX - x
                let top =  touch.clientY - y
                // 设置移动范围
                if(left <= 0) left = 0
                if(left >= maxLeft) left = maxLeft 
                if(top <= 46) top = 46 //最小为头部底边
                if(top >= maxTop) top = maxTop
                //移动当前元素(改变定位)
                odiv.style.left = left + 'px';
                odiv.style.top = top + 'px';
            };
            document.ontouchend = () => {
                document.ontouchmove = null;
                e.preventDefault()
                var nowTime = (new Date()).getTime();//松开时的时间
                // 小于300ms可以识别为点击事件的范围,最好设置为50
                if(nowTime - startTime < 50) this.$router.push('/favorites')
            }
        }

在编写功能的过程中，发现如果设置了touchstart.prevent，则设置的click就会被阻止触发，所以将点击事件执行体写在了拖拽事件的最后阶段。
该解决方法参考：https://oss.so/article/65