🕹 @vueuse/gesture


Vue Composables making your app interactive

- 🚀 Plug & play
- 🕹 Mouse & Touch support
- 🎮 Directives support (v-drag, v-pinch, v-move...)
- ✨ Written in TypeScript
- ✅ Supports Vue 2 & 3 using vue-demi
- 🤹 Plays well with vueuse/motion or any other animation solution

🌍 Documentation

👀 Demos

Quick Start

Let's get started quickly by installing the package and adding the plugin.

From your terminal:

``bash
pnpm add @vueuse/gesture
`

In your Vue app entry file:

`javascript
import { createApp } from 'vue'
import { GesturePlugin } from '@vueuse/gesture'
import App from './App.vue'

const app = createApp(App)

app.use(GesturePlugin)

app.mount('#app')
`

You can now interact with any of your component, HTML or SVG elements using v-drag or any other directive.

`vue



``

To see more about the gestures events data, check out Gesture State.

To see more about the gestures options, check out Gesture Options.

Also, here is a list of the available gestures:

- Drag
- Move
- Hover
- Scroll
- Wheel
- Pinch

Credits

This package is a fork react-use-gesture by pmndrs.

If you like this package, consider following me on GitHub and on Twitter.

👋