Detect Long Press In Vue App

Description:

A small yet sometimes useful Vue.js directive to detect and handle the long press event on an element.

How to use it:

Import the LongPress.

import LongPress from 'vue-directive-long-press'

Use the directive.

<template>
  <button
    v-long-press="500"
    @long-press-start="onLongPressStart"
    @long-press-stop="onLongPressStop">
    Click and Hold for 500ms</button>
</template>
export default {
  directives: {
    'long-press': LongPress
  },
  methods: {
    onLongPressStart () {
      // do something
    },
    onLongPressStop () {
      // do something
    }
  }
}

Preview:

Detect Long Press In Vue App

Download Details:

Author: FeliciousX

Live Demo: https://stackblitz.com/edit/vue-directive-long-press-demo

Download Link: https://github.com/FeliciousX/vue-directive-long-press/archive/master.zip

Official Website: https://github.com/FeliciousX/vue-directive-long-press

Last Update: August 14, 2019

Install:

# NPM
$ npm install vue-directive-long-press --save

You Might Be Interested In:

Add Comment