vue3-help/dist/hooks/useTouch.js

Vue3 帮助工程

import{reactive,computed}from"vue";const touchState=reactive({start:{clientX:0,clientY:0},move:{clientX:0,clientY:0},end:{clientX:0,clientY:0}}),slideState=computed(()=>({x:touchState.move.clientX-touchState.start.clientX,y:touchState.move.clientY-touchState.start.clientY})),useTouch=()=>({touchState:touchState,slideState:slideState,touchstart:t=>{const{clientX:e,clientY:c}=t.changedTouches[0];Object.assign(touchState.start,{clientX:e,clientY:c})},touchmove:t=>{const{clientX:e,clientY:c}=t.changedTouches[0];Object.assign(touchState.move,{clientX:e,clientY:c})},touchend:t=>{const{clientX:e,clientY:c}=t.changedTouches[0];Object.assign(touchState.end,{clientX:e,clientY:c})}});export default useTouch;