vue-click-helper

A Vue directive to distinguish between click and double click
3,059 10
Install
npm install vue-click-helper
Latest Version:0.0.2
License:MIT
Last Updated:Aug 24, 2017
Links: GitHub  ·  npm
Maintainer: huangshuwei

vue-click-helper

A Vue directive to distinguish between click and double click.

Introduction

By default, two click interval of less than 300 ms will execute double click event, otherwise click events will execute click event

Installation

npm i vue-click-helper -D

Basic Usage

<template>
    <div v-click-helper="clickHelper">click me</div>
</template>

import Vue from 'vue'
import vueClickHelper from 'vue-click-helper'

export default{
    directives: {
        'click-helper': vueClickHelper
    },
    methods:{

            clickHelper(e,isDoubleClick){

                if (isDoubleClick){

                    // execute double click logic...
                }else{

                    // execute normal click logic...
                }
            }
    }

}

Advanced

If you want to set, execute double click within 290 milliseconds,just:

<template>
    <div v-click-helper:290="clickHelper">click me</div>
</template>

License

http://www.opensource.org/licenses/mit-license.php

Related Packages

v-click-outside-x

Vue directive to react on clicks outside an element.

792,715 7
v3-click-outside

Vue3 directive to react on clicks outside an element. Its simple to use. And can...

22,256 4
vue-clickoutside

A Vue directive about listener a click outside an element.

9,169 10
vue-outside-click

Directive for VueJS, handle click outside target element

5,228 1
vue-click-outside-of

Vue 3 directive and hook for detecting click outside an element

18,967 1

Version History

Version Released License
0.0.2 MIT
0.0.1 MIT