vue.js - 如何使用 Vue 处理触摸事件？

Question

是否可以在没有外部库的情况下使用 Vue3 处理 touchEvents？

我的需要是元素可以通过触摸移动(拖放到另一个地方)。元素本身使用 v-for 呈现。我实现了鼠标控制没有问题，但是触摸我卡住了一天!

我只找到一个库:https://github.com/robinrodricks/vue3-touch-events

但我真的不明白我必须把 UDM 模块放在哪里以及如何执行这样的安装步骤:“你需要包含这个插件的 UMD 脚本，你不需要注册这个插件vue.js。”

我不敢相信像 Vue3 这样流行的框架没有原生的触摸处理程序，所以我想请教一下。

Answer 1

Vue 原生支持触摸事件，就像在 JavaScript 中一样。但是拖动或滑动功能，您需要自己构建或使用第三方插件(如 hammer.js )。

您可以使用与鼠标向上/向下类似的方式使用触摸事件。例如:

<MyComponent
  @mousedown="startDrag(item)"
  @mouseup="endDrag(item)"
  @mousemove="startDrag(item)"
  @touchstart="startDrag(item)"
  @touchend="endDrag(item)"
  @touchmove="endDrag(item)"        
/>