Vue-router: `this` is undefined in beforeRouteLeave hook in some cases

[narwajea]

Vue.js / vue-router versions

2.1.10 / 2.1.3

Steps

1. I detect the session is expired in a global HTTP interceptor: Vue.http.interceptors.push((request, next) => {...})

2. I attempt to redirect the user so that he/she can authenticate: router.push({...})

3. The beforeRouteLeave hook of a component is triggered

What is Expected?

this is defined

What is actually happening?

this is undefined

This seems to happen only locally, after my machine wakes up from sleep, while the Node.js server is still running, and after I make some changes to the code (with webpack hot reload enabled).

[fnlctrl]

Hi, thanks for filling this issue. Please follow the Issue Reporting Guidelines and provide a live reproduction on jsfiddle, codepen etc. Thanks!

[narwajea]

Unfortunately, I am not able to reproduce it on demand on my own environment..

[posva]

Ok, if you ever manage to reproduce it, make sure to open a new issue 🙂

[pastdevr]

Hey, this issue can be reproduced.
For example, I have two routes _/one_, _/two_ with same component. When I go from _/one_ to _/two_ this is defined in beforeRouteLeave hook. Then when I go from _/two_ to some other route I have this is undefined.

[narwajea]

I managed to reproduce it as well, but only on my own environment. I am not able to create a runnable reproduction link (JSFiddle / JSBin / CodePen) at this point.

[posva]

If you manage to boil it down to the strict minimum on a repository, we can also look at that

[pastdevr]

Look at this JSFiddle.
Steps to reproduce error:

• Click /home (beforeRouteLeave is not invoked, ok)

• Click _/foo_ (this in beforeRouteLeave is defined, ok)

• Click _/bar_ (this in beforeRouteLeave is not defined, bad)

[pastdevr]

It looks like it fixed in 2.5.2 version of vue-router. Thanks

[nick-running]

@pastdevr thanks.the latest version certainly fixed that bug