Skip to content
Branch: master
Find file History
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
..
Failed to load latest commit information.
src
index.js
readme.md

readme.md

长按事件插件

使用 vue 指令为元素添加长按事件

判断为长按事件的条件:

  • 手指停留超过一段时间,参见下面的参数time
  • 手指没有移动,参见下面的参数disXdisY,可通过配置选择不判断手指是否移动

使用插件

import LongTap from './plugins/LongTap'

Vue.use(LongTap)

注册长按事件

<div v-longtap:[arg]="callback"></div>

<div v-longtap:[arg]="{handler: cb}"></div>

对象字面量配置参数

使用对象字面量方式绑定长按事件,可以配置一些参数

参数 类型 是否必需 默认值 说明
handler 函数 长按事件回掉函数
time integer 1200 单位:ms,长按间隔时间,必须超过 500ms
disX number 10 单位:px,判断手指是否移动了的间隔,若为负数,则允许 X 方向上的移动
disY number 10 单位:px,判断手指是否移动了的间隔,若为负数,则允许 Y 方向上的移动

长按回调函数参数

参数 类型 说明
event Event
data any 注册事件时传入的动态指令参数
vNode vNode 触发长按事件的虚拟节点

长按时元素样式

长按元素时,可以为该元素添加激活时的样式,只需要添加一个全局的样式 longtap-active 即可,若有与元素本身的样式重复的,应添加 !important

该样式在点击时也会应用。

You can’t perform that action at this time.