我使用vue-property-decorator包来'm trying to implement Vue Router' s in-component navigation guards . 底层，vue-property-decorator依赖于vue-class-component包 . 它提供了一个 registerHooks 方法，允许您声明应将哪些方法视为生命周期挂钩（而不是实例方法） .

以下代码有效，导致进入路线时发出警报：

import { Component, Vue } from 'vue-property-decorator';
import { router } from './Router';

@Component({
    template: '<div></div>'
})
export class Foo extends Vue {

    beforeRouteEnter(to, from, next){
        alert('Entering Foo');
        next();
    }
}

router.addRoutes([
    { path: '/foo', component: Foo }
]);

Router.ts文件包含根据the docs的钩子注册，并且完全符合：

import VueRouter from 'vue-router';
import { Component } from 'vue-property-decorator'

Component.registerHooks([
  'beforeRouteEnter',
  'beforeRouteUpdate',
  'beforeRouteLeave'
]);

export const router = new VueRouter({
  mode: 'abstract'
});

在导入组件之前，路由器文件在App.ts文件中导入，因此挂钩在组件之前注册 .

但是，我似乎是 unable to pass in a callback to the nextmethod . 鉴于上面更新的 Foo 组件：

import { Component, Vue } from 'vue-property-decorator';
import { router } from './Router';

@Component({
    template: '<div></div>'
})
export class Foo extends Vue {

    beforeRouteEnter(to, from, next){
        next(vm => {
            alert('Entering Foo');
        });
    }
}

警报永远不会被触发 . 我错过了什么，或者这是vue-class-component包中的错误？我应该补充一点，我也无法将回调传递给每个路由和全局路由导航保护中的下一个函数 .

非常感谢任何帮助，非常感谢！

javascript typescript vuejs2 vue-router vue-class-components