vue-long-click
vue-long-click
Vue long click (longpress) directive
Checkout the demo at https://ittus.github.io/vue-long-click/

Install
npm install vue-long-click --save
import { longClickDirective } from 'vue-long-click'
const longClickInstance = longClickDirective({delay: 400, interval: 50})
Vue.directive('longclick', longClickInstance)
CDN
Include vue-long-click library from cdn
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.10/dist/vue.js"></script>
<script src="https://unpkg.com/vue-long-click@0.0.4/dist/libs/vue-long-click.umd.min.js"></script>
and create custom directive to use
const longClickInstance = window['vue-long-click'].longClickDirective({delay: 400, interval: 50})
Vue.directive('longclick', longClickInstance)
Usage
<button v-longclick="() => changeValue(1)">+</button>
Config
| Prop | Type | Default | Description |
|---|---|---|---|
| delay | Integer (milliseconds) | 400 | Delay until long click function is fired |
| interval | Integer (milliseconds) | 50 | If value is greater than 0, handler function will be fire every interval milliseconds when component is pressed |
Development
## Project setup
npm install
## Compiles and hot-reloads for development
npm run serve
## Build library
npm run build:lib
## Run tests
npm run test
## Lints and fixes files
npm run lint
Related Packages
vue3-delay-watch
vue 3 watcher that waits a minimum delay until the latest state gets passed to t...
3,974
1
vue-interval
A vue mixin to use methods as intervals, show times and values in intervals and...
1,645
10
@nanogiants/vue3-longpress
This package contains a Vue 3 directive which adds the `@longpress` event to an...
2,241
2
vuetify-time-range-picker
A time range picker, made so users can easily pick a one day time interval.
842
3
Version History
| Version | Released | License |
|---|---|---|
| 0.1.0 | MIT | |
| 0.0.4 | MIT | |
| 0.0.3 | MIT | |
| 0.0.2 | MIT | |
| 0.0.1 | MIT |
Pre-releases (1)
| Version | Released | License |
|---|---|---|
| 0.1.0-beta.1 | MIT |