Prevent enter route

[hugo-cardoso]

I would like, given a business rule applied in beforeLoad, navigation to be cancelled.

export const Route = createFileRoute("/my-page")({
  component: () => <Page />,
  beforeLoad() {
    const isAllowed = false;

    if (!isAllowed) {
      // prevent entering the page
    }
  }
});

Is this possible?

References:

https://router.vuejs.org/guide/advanced/navigation-guards.html#Per-Route-Guard
https://router.vuejs.org/guide/advanced/navigation-guards.html#Global-Before-Guards

[schiller-manuel]

you could throw a redirect

[hugo-cardoso]

It would be great to be able to do that!

[schiller-manuel]

hm no this probably won't work. beforeLoad is executed after the location has already been committed.

[hugo-cardoso]

This behavior is curious. The documentation says that beforeLoad runs before the route is loaded.

Does this mean that at this moment he has already destroyed the previous route?

[hugo-cardoso]

Hi! Is there any implementation planned to support this or does it not make sense at the moment?

[schiller-manuel]

nothing planned at the moment, but could be further investigated (not a priority right now though)