focux / vue-long-touch

Detect long touch in any element.

vue-long-touch

Detect when an element has been touched for X ms.

⚠ This only works in touch devices due that we are using touch events to detect when you press some element.

Demo

Table of contents

• Installation
• Usage
• Example

Installation

npm install --save vue-long-touch

Import

import Vue from 'vue'
import LongTouch from 'vue-long-touch';

Vue.use(LongTouch)

OR

import Vue from 'vue'
import LongTouch from 'vue-long-touch';

Vue.use(LongTouch, { duration: 900 })

Usage

The v-long-touch directive is very easy to use. Just pass a function as the value:

<div id="app" v-long-touch="handleLongTouch">

Example

<template>
  <div id="app" v-long-touch="handleLongTouch">
    Long Touch {{times}} times
  </div>
</template>

<script>
export default {
  name: "App",
  data() {
    return {
      times: 0
    };
  },
  methods: {
    handleLongTouch() {
      this.times += 1;
    }
  }
};
</script>

---

License

MIT