JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://cdn.jsdelivr.net/vue/latest/vue.js"></script>
<div id="app">
<div
@click="oneClick($event)"
>
Clicky
</div>
<div v-for="res in result" v-text="res">
</div>
</div>
JavaScript
new Vue({
el: '#app',
data: {
result: [],
delay: 700,
clicks: 0,
timer: null
},
mounted: function() {
console.log('mounted');
},
methods: {
oneClick: function(event){
this.clicks++
if(this.clicks === 1) {
var self = this
this.timer = setTimeout(function() {
self.result.push(event.type);
self.clicks = 0
}, this.delay);
} else{
clearTimeout(this.timer);
this.result.push('dblclick');
this.clicks = 0;
}
}
}
});