v-touch

V-touch is a gesture recognition system for Vue.js apps that lets you respond to finger touches and swipes without writing complicated touch-handling code yourself. Instead of manually tracking finger positions, you attach a simple directive to any element and it automatically detects taps, swipes, presses, and other common touch gestures—then calls your code in response.

Here's how it works in practice. You add v-touch to an HTML element in your Vue template, give it some configuration (like which directions to track), and then define methods in your Vue component. When someone taps, double-taps, swipes left or right, swipes up or down, or presses and holds on that element, the directive detects the gesture and automatically calls the matching method. For example, a swipe to the left triggers your swipeLeft() method. The directive handles all the messy details of tracking finger position and timing—you just write simple handler functions.

This is most useful for mobile web apps and touch-enabled interfaces where you want natural finger interactions. Imagine a photo gallery where you swipe left to go to the next photo or press and hold to see options—instead of building gesture detection from scratch, you'd use v-touch to get that behavior with just a few lines of code. It supports tap, double-tap, multi-tap, press-and-hold, and swipes in all four directions. You can also toggle support for horizontal or vertical gestures independently, so you only listen for the interactions you actually need.

The README notes that if you're already using another touch library called vue-touch, you can rename the directive to avoid conflicts—for instance, calling it v-move instead. The project was still under development when documented, but is ready for experimentation in real projects.