类星体提供了功能齐全的 Vue 指令，可以完全取代像Hammerjs这样的库:v-touch-pan, v-touch-swipe, v-touch-hold，甚至v-touch-repeat。
这些指令不仅可以处理鼠标事件，还可以处理触摸事件，所以您可以用它们在您的 App 中完成一些很酷的事情。
下面我们将讲述v-touch-repeat指令
Vue 指令，当用户触摸并按住一个组件或元素时，在指定的时间间隔内触发一个事件。
TouchRepeat API
用法
在下面的区域中，点击鼠标/点击屏幕后按住，然后查看页面的变化，注意，在有触摸功能的设备上，页面滚动会被禁用。
默认的重复模式是 0:600:300(毫秒)。
下面的示例中，配置了也对SPACE, ENTER 和 h 按键做出反应（请先关注此处），使用 0:300:200 (ms) 重复模式。热键，点击/触摸，然后保持住。
下面的示例中，将 TouchRepeat 应用在了 QBtn 上，注意指令的参数是如何使得蓝色的按钮加速慢于红色按钮的。
处理鼠标事件
当您想处理鼠标事件时，使用mouse修饰符：
<div v-touch-repeat.mouse="myHandler">...</div>处理按键事件
当您也想处理按键事件时，使用 keycodes 作为修饰符:
<div v-touch-repeat.65.70="myHandler">...</div>对于常用按键，可以使用命名修饰符 esc、tab、enter、space、up、left、right、down 和 delete 来代替编写对应的 keycode。其中 delete 修饰符同时处理 Backspace 和 Delete 键。
Inhibiting TouchRepeat
您可以通过阻止内部元素touchstart/mousedown/keydown事件的冒泡行为来抑制 TouchRepeat 事件：
<div v-touch-repeat.mouse.enter="userHasHold">
<!-- ...content -->
<div @touchstart.stop @mousedown.stop @keydown.stop>
<!--
TouchRepeat 事件不会应用到这里， 因为我们
在 touchstart，keydomn 和 mousedown 事件上
调用了 stopPropagation()
-->
</div>
<!-- ...content -->
</div>然而，若您使用capture，keyCapture 或者 mouseCapture修饰符，则事件会先到达 TouchRepeat 指令，然后才是内部元素，所以 TouchRepeat 事件仍然会被触发。
TouchRepeat 触发后的事件
一旦至少触发过一次重复，该指令就会消费掉结束手势的那个事件，这样一次「按住不放」就不会同时被当成一次轻触、一次点击或一次按键——无论作用在元素本身还是它的任意父元素上。对于触摸事件这个事件是 touchend，对于鼠标事件是 click，对于键盘事件则是 keyup。
这意味着在 TouchRepeat 开始重复之后，元素上的 @touchend 监听器不会被调用。而当用户在第一次重复之前就抬起手指时，它仍会被调用。如果你两种情况下都需要它，请在捕获阶段监听：
<div v-touch-repeat="myHandler" @touchend.capture="userHasLifted">
<!-- ...content -->
</div>click 和 keyup 事件是在 document 层面就被拦截的，还没到达你的元素，因此捕获阶段在这里帮不上忙。鼠标事件在其他方面不受影响：@mousedown 和 @mouseup 始终会被调用，只有随后的 @click 会被抑制。