diff --git a/docs/v-ga.md b/docs/v-ga.md index 0113213..7e7aad5 100644 --- a/docs/v-ga.md +++ b/docs/v-ga.md @@ -71,6 +71,32 @@ Then we only need to add the `v-ga` directive to your element and access the met ``` +By default, the directive is executed when the element is clicked. However, if you want to change the event type for the logging, you can add the proper event as a modifier. + +```html + + + +``` + If there's no need to pass any arguments, we could also just pass the name of the method as a string, and the plugin will look it up for us ```html diff --git a/src/directives/ga.js b/src/directives/ga.js index 70ef58d..f225891 100644 --- a/src/directives/ga.js +++ b/src/directives/ga.js @@ -1,17 +1,25 @@ import config from '../config' export default { - inserted: function (el, { value }, vnode) { - el.addEventListener('click', function () { - let fn = typeof value === 'string' - ? config.commands[value] - : value + inserted: function (el, binding, vnode) { + const events = Object.keys(binding.modifiers) - if (!fn) { - throw new Error('[vue-analytics] The value passed to v-ga is not defined in the commands list.') - } + if (events.length === 0) { + events.push('click') + } - fn.apply(vnode.context) + events.forEach(event => { + el.addEventListener(event, function () { + let fn = typeof binding.value === 'string' + ? config.commands[binding.value] + : binding.value + + if (!fn) { + throw new Error('[vue-analytics] The value passed to v-ga is not defined in the commands list.') + } + + fn.apply(vnode.context) + }) }) } } \ No newline at end of file