0

Looking to implement some logging with the purpose of generating some usage statistics for a web application written with Vue.

I want to avoid writing an explicit 'log' statement within or with every 'on click' callback.

Is it possible to wrap/override the v-on:click directive to first perform logging, then execute the callback?

Morgan
  • 303
  • 2
  • 15
  • Don't know an approach in Vue.js to achieve this. Maybe this can help - https://github.com/colxi/getEventListeners Warning: Be careful with this approach. Monkey patching may introduce more problems than it solves. – Tushar Arora May 24 '19 at 10:10

2 Answers2

1

As far as I know it is not possible to do it for all v-on:clicks at the same time. As the event handlers are connected to the specific elements you would need to do it for every element separately. Instead you can add an eventlistener for click events like this:

window.addEventListener('click', e => console.log(e))

or like this

document.onclick = e => console.log(e)

Note that this will log every single click, even if it's not on an element with v-on. The event here gives you the source element that was clicked, that you might be able to use to define if the click is relevant for your logging or not.

Lassi Uosukainen
  • 1,598
  • 13
  • 22
1

This previous post could work for you: Extend vueJs directive v-on:click

A wrapper component for you click event elements.

Abarth
  • 176
  • 1
  • 11