1👍
✅
For my solution. It’s needToPassDatas is you needed to pass an argument data
<div id="app">
<div>
<button @mousetrapped="trapped" v-keyboardtrap="needToPassDatas">
keyboardtrap
</button>
<div/>
</div>
Vue.directive('keyboardtrap', {
bind: function (el, binding, vnode) {
el.addEventListener('keydown', onKeyDown);
function onKeyDown(e) {
var handlers = (vnode.data && vnode.data.on) ||
(vnode.componentOptions && vnode.componentOptions.listeners);
if (handlers && handlers['mousetrapped']) {
handlers['mousetrapped'].fns(binding.value);
}
}
},
})
new Vue({
el: '#app',
methods: {
trapped (e) {
alert('trapped' + e)
}
}
})
Ref by: vuejs.org Dynamic Directive Arguments, stackoverflow.com Trigger emit in directive method
Source:stackexchange.com