this.app won't work inside beforeEnter

Inside a beforeEnter per-route guard the Router instance is this.a instead of this.

Example:

new VueRouter({
    routes: [
        {
            beforeEnter: (to, from, next) => {
                this.app // app is undefined
                this.a.app // this works!
            }
        }
    ]
})

It’s normal?

[Naskalin]

same problem

// vue-router@3.0.1
// vue@2.5.16
new VueRouter({
    routes: [
        {
            name: 'test', path: '/test', component: Test,
            beforeEnter: (to, from, next) => {
                console.log(this); // {a: VueRouter}
                console.log(this.a.app); // Vue
            },
            beforeEnter(to, from, next) {
                console.log(this); // undefined
            },
            // and for completeness
            beforeEnter: function (to, from, next) {
                console.log(this); // undefined
            },
        }
    ],
});

[fnlctrl]

You’re using arrow functions that doesn’t have access to the desired this, please use normal functions instead:

beforeEnter(to, from, next) {
    this.app
}