Question

我试图为我的孩子路线定义一个beforeEnter后卫，但我没有成功。这是我的路线配置：

  ...
  {
    path: '/',
    component: App
    beforeEnter: (to, from, next) ->
       # This block is only reached when I refresh the page

    children: [
      {
        name: 'component1',
        path: '/component1',
        components: component1
      },
      {
        name: 'path2',
        path: '/path2',
        components: component2
      },
     ...
    ]
  }
  ...

当我刷新页面或直接在浏览器上插入URL时，一切正常（例如：base_path / path2）。但是当我点击重定向到path1或path2的路由器链接时，beforeEnter后卫不会执行。

我明白了什么不对吗？我是否需要为每个孩子设置一个beforeEnter后卫？

Answer 1

我找到的最佳解决方案是使用beforeEach guard而不是beforeEnter。

beforeEnter是一个每个路由保护，然后它只应用于父路由，但不适用于子路由。

Answer 2

尝试添加beforeRouteUpdate钩子，即

...
{
path: '/',
component: App
beforeEnter: (to, from, next) ->
   # This block is only reached when I refresh the page
beforeRouteUpdate: (to, from, next) ->
   # This will called when you use router-links
children: [
  {
    name: 'component1',
    path: '/component1',
    components: component1
  },
  {
    name: 'path2',
    path: '/path2',
    components: component2
  },
 ...
]
}
...

Answer 3

@ strelok2010，beforeRouteUpdate是组件的挂钩。

Vue-router：beforeEnter guard对于子路径不能正常工作

3 个答案: