0

I am trying to switch over to vuejs3 and the new vue-router.

Now I see that beforeRouteEnter is not exposed:

 // same as beforeRouteUpdate option with no access to `this`
        onBeforeRouteUpdate((to, from, next) => {
            // your logic
            console.log("Hello world") //this is only triggered if the id changes
            next()
        })

So my question is: How can I trigger the initial axios-requests on a specific route like /dashboard as I did before?

SPQRInc
  • 162
  • 4
  • 23
  • 64
  • Did you check these? https://next.router.vuejs.org/guide/advanced/navigation-guards.html#per-route-guard https://next.router.vuejs.org/guide/advanced/composition-api.html#navigation-guards – RajkumarG Feb 16 '21 at 11:49
  • Hi RajkumarG, yes, I did. And I did not see a method that applies as beforeRouteEnter-guard within the setup-method. Maybe this is not a concept here? – SPQRInc Feb 16 '21 at 12:31

1 Answers1

1

It's not possible to execute code in setup before the route enters because at the time of setup the navigation has already been confirmed.

Another option #1

You can still use the options api, so you could still use beforeRouteEnter:

setup() {
  ...
},
beforeRouteEnter(to, from, next) {
  console.log(to);
}

Another option #2

Use beforeEnter in the router:

{
  path: '/foo',
  component: Foo,
  beforeEnter(to) {
    console.log(to)
  }
}
Dan
  • 59,490
  • 13
  • 101
  • 110