vue.js - Vuejs 2 - 从 child 到 parent 时观看路线

Question

我有以下路由结构

/event/:id/schedule/:id

我想要的是，当用户转到子组件/路由时，父组件的某些元素会隐藏。当用户回到父级时，那些元素应该回来。

在父组件上，我尝试观察 $route 对象，但没有触发任何东西。在父组件的 mounted/created 方法上附加 Hook 是行不通的，因为用户仍在那些路由中。我看到了一些关于

watch(){
        $route: {
            console.log('route change');
        }
    }

我也试过这个:

route: {

        canReuse: false

    },

它不起作用，如果不起作用，我也不想使用它。

任何其他想法都会很有帮助。谢谢。

Answer 1

刚刚在 vue-router 文档中发现了一些路由 Hook /导航守卫。只是将以下内容用于父组件。

beforeRouteUpdate (to, from, next) {
        // called when the route that renders this component has changed,
        // but this component is reused in the new route.
        // For example, for a route with dynamic params /foo/:id, when we
        // navigate between /foo/1 and /foo/2, the same Foo component instance
        // will be reused, and this hook will be called when that happens.
        // has access to `this` component instance.
    },

这很好用