1. Vue.directive('longpress', {
    2.     bind: function(el, binding, vNode) {
    4.         // 确保提供的表达式是函数
    5.         if (typeof binding.value !== 'function') {
    6.             // 获取组件名称
    7.             const compName = vNode.context.name;
    8.             // 将警告传递给控制台
    9.             let warn = `[longpress:] provided expression '${binding.expression}' is not a function, but has to be `;
    10.             if (compName) { warn += `Found in component '${compName}' `}
    12.             console.warn(warn);
    13.         }
    15.         // 定义变量
    16.         let pressTimer = null;
    18.         // 定义函数处理程序
    19.         // 创建计时器（ 1秒后执行函数 ）
    20.         let start = (e) => {
    22.             if (e.type === 'click' && e.button !== 0) {
    23.                 return;
    24.             }
    26.             if (pressTimer === null) {
    27.                 pressTimer = setTimeout(() => {
    28.                     // 执行函数
    29.                     handler();
    30.                 }, 1000)
    31.             }
    32.         }
    34.         // 取消计时器
    35.         let cancel = (e) => {
    37.             // 检查计时器是否有值
    38.             if ( pressTimer !== null ) {
    39.                 clearTimeout(pressTimer);
    40.                 pressTimer = null;
    41.             }
    42.         }
    44.         // 运行函数
    45.         const handler = (e) => {
    46.             // 执行传递给指令的方法
    47.             binding.value(e)
    48.         }
    50.         // 添加事件监听器
    51.         el.addEventListener("mousedown", start);
    52.         el.addEventListener("touchstart", start);
    54.         // 取消计时器
    55.         el.addEventListener("click", cancel);
    56.         el.addEventListener("mouseout", cancel);
    57.         el.addEventListener("touchend", cancel);
    58.         el.addEventListener("touchcancel", cancel);
    59.     }
    60. })