vue 2.0实现在指令里监听组件自定义事件

Question

想要在v-my-directive的bind触发时，绑定对组件my-input的someEvent事件监听

<template>
    <my-input v-my-directive="xxx"></my-input>
</template>

inside MyInput file:

<template>
    <div class="my-input">
        <input type="text"/>
    </div>
</template>
<script>
    export default {
         name: 'MyInput',
         created() {
             this.trigger()
         },
         methods: {
             trigger(){
                 this.$emit('someEvent')
             }
         }
    }
</script>

inside MyDirective file:

export default Vue.directive('my-directive', {
     bind(el, binding, vnode) {
        // listen to someEvent here
     }
})

是否有办法做到？

Answer 1

指令中使用 vnode.componentInstance.$on()

Answer 2

指令绑定的时候(mount)实例已经初始化完毕了，因此指令无法实现实例创建过程中的事件监听。所以可以尝试在 mounted 中触发事件。

Answer 3

可以做以下尝试：
将someEvent作为你的自定义指令的一个参数传入。比如：

<template>
    <my-input v-my-directive:someEvent="xxx"></my-input>
</template>

export default Vue.directive('my-directive', {
     bind(el, binding, vnode) {
        const ev = binding.arg;
        //接下来是如何触发事件，
        //如何获取到组件里的this？是否也将this通过arg或者modifiers的方式传入？
        //你可以试一下
     }
})

Answer 4

<template>
    <my-input v-my-directive @someEvent></my-input>
</template>

vnode.data.on.someEvent.apply(vnode.context,[参数...]);