directive/index.ts

const longPress = {
    beforeMount(el, binding, vnode){
        let timer;
        let interval = binding.value.interval || 1000;

        el.addEventListener('mousedown', (e) => {
          timer = setTimeout(() => {
            binding.value.handler(e);
          }, interval);
          e.preventDefault();
        });

        document.addEventListener('mouseup', () => {
          clearTimeout(timer);
        });

        el.addEventListener('touchstart', (e) => {
          timer = setTimeout(() => {
            binding.value.handler(e);
          }, interval);
        //   e.preventDefault();阻止默认的click事件
        });

        document.addEventListener('touchend', (e) => {
          clearTimeout(timer);
        });

    }
}
export { longPress };

main.ts全局注册

import { debounce,longPress } from "./directive/index.ts";
app.directive('longPress',longPress);

页面中使用

     <li v-longPress="{ interval: 2000,             handler:changeFn,index:index }">