Quasar提供全功能的可以完全替代Hammerjs这样的库的Vue指令：v-touch-pan，v-touch-swipe、v-touch-hold和v-touch-repeat。

这些指令也适用于鼠标事件，不仅是触摸事件，所以您也可以在桌面上为您的应用程序构建酷炫的功能。

我们将在下面的行中描述v-touch-repeat指令。

TouchRepeat API

用法

在下面的区域单击并按住鼠标，以查看其运行情况。 请注意，在具有触摸功能的设备上，滚动不会被阻止。

默认重复模式是0:600:300 (ms).

以下是配置为还对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>

您不需要编写一些特殊的修饰符即可编写等效的keycode：space、tab、enter。

禁止TouchRepeat

当您想禁止TouchRepeat时，可以通过停止内部内容中的touchstart/mousedown/keydown事件的传播来实现：

<div v-touch-repeat.mouse.enter="userHasHold">
  <!-- ...content -->
  <div @touchstart.stop @mousedown.stop @keydown.stop>
    <!--
      TouchRepeat不适用于此处，因为
       我们在touchstart、mousedown和keydown事件上
       调用stopPropagation（） 
    -->
  </div>
  <!-- ...content -->
</div>

但是，如果使用capture、mouseCapture或keyCapture修饰符，则事件将首先到达TouchRepeat指令，然后到达内部内容，因此TouchRepeat仍将触发。

关于HMR的注意事项

由于性能原因，并不是所有的修饰符都是响应式的。有些需要刷新窗口/页面/组件才能更新。请检查API卡中未标记为响应式的修饰符。