BeforeEnter does not run

I am trying to check if the user is logged in.

Trying to use beforeEnter.

But if I just pass the function name there:
{
path: ‘/’,
component: HomePage,
beforeEnter: checkAuth
}
checkAuth function does not run.

And if i write beforeEnter: checkAuth(), i need to somehow pass the arguments (to, from, resolve, reject) to it, but this cannot be done either.

v6

{
  path: '/some-page/',
  component: Component,
  beforeEnter: function ({ resolve, reject }) {
    condition ? resolve() : reject()
  }
}

I did it like this, but again nothing happens. And what worries me is that the beforeEnter highlighted in gray. I’m clearly doing something wrong.

i see
it seems like it doesn’t work on “Initial Page Route”

i don’t know what to say

only for your initial route you can do something like this:

{
  path: '/',
  component: condition ? ComponentA : ComponentB
}

I understand correctly that if someone enters the my_site/profile in the address bar and goes to the page, will this page be the initial route?

Is there any other way to check if a user is logged into the site?

var routes = [
  {
    path: '/',
    url: './index.html',
    // this will never be called
    beforeEnter: function ({ resolve, reject }) {
      true ? resolve() : reject()
    }
  },
  {
    path: '/profile/',
    url: './pages/profile.html',
    // this is ok
    beforeEnter: function ({ resolve, reject }) {
      console.log("beforeEnter called")
      true ? resolve() : reject()
    }
  },
];

i dont know if it’s a bug or feature (need to “investigate” the soucre code)

anyway:
in your case => “my_site/profile”
assuming “BrowserHistory” (ex. “pushState”) + server is configured
the “beforeEnter” func will be called on ‘/profile/’ page

If I go to my_site.com/profile not by the link, but by entering it in the address bar, then beforeEnter also does not work.

To check if the user is authorized, I need to write something like the following in each route?


Or is there a way to check this and redirect the user when starting the site?

no
component prop is not a “computed property”
it is a “stored property” (static value)

use this:

{
  path: '/about/',
  url: './pages/about.html',
  beforeEnter: function ({ resolve, reject }) {
    resolve()
  }
}

for some reason it is not working on this route

{
  path: '/',
  url: './index.html',
  beforeEnter: function ({ resolve, reject }) {
    reject()
  }
}

i dont know why

Hi,

Did you fixed this one? I have exactly the same problem. I tried all I knew, but code under beforeEnter is never executed. Doesnt matter the path, always fails and I have several apps working with this solutions. I think, it is a bug of v6 version

Regards
Miguel

I found, it doesn’t work when components are loaded from tabs, but they work when loading from buttons. is it a feature? I miss the previous behavior