javascript - Vue router-link 和自定义事件

Question

我正在尝试在 vue 中的路由器链接上创建自定义事件，但它似乎不起作用。我想做这样的事情-

父级-

<Home @customEvent="myEventHandler" />

脚本-

export default {
methods: {
    myEventHandler() {
        console.log('yay')
    }
}

child

export default {
...
mounted() {
    axios.get('api/link').then(res => {
        this.posts = res.data;
        this.$emit('customEvent')
    }
}

这可以很好地使用常规组件创建 yay 日志，但是当我尝试做这样的事情时 -

<router-link to='/home' @customEvent="myEventHandler">Home</router-link>

这似乎不起作用。如何监听来自使用 router-link 创建的组件的自定义事件？

提前致谢...

Answer 1

这是可能的。您只能从子级到父级$emit事件，不能在2个不同路由器之间$emit事件

Emit event from children to parent

Can't emit event between 2 different routes:

要解决此问题，您可以为组件 A 和组件 B 创建一个包装组件，然后使用 router-view 接收事件