I want <router-link> to transition to a different page depending on the condition.

Asked 2 years ago, Updated 2 years ago, 127 views

I want to transition router-link to a different page depending on the conditions

I am currently creating a login feature and
I would like to make it impossible to transition to the dedicated page without logging in to various pages.

(Example) Login is required to go to the page where you want to create the event

If you are not logged in, go to the ->Login page
When logged in, go to the ->Event Creation Page

I would like to implement different movements depending on the conditions such as

I don't know how to do it, so I don't know what to do

I searched router-link conditional branch, but I didn't get the answer I expected.

I would appreciate it if you could let me know if there are any keywords or helpful links to search for.

firebase vue.js

2022-09-30 17:51

1 Answers

You can use a feature called Navigation Guard to specify whether to use the Vue Router to perform or suppress transitions.

As this name implies, the navigation guard provided by vue-router is primarily used to guard transitions by redirecting or canceling.There are many ways to hook the route navigation process (global, per route, within components).

Remember that changes to parameters or queries do not trigger the enter/leave navigation guard.You can either monitor the $route object to accommodate these changes or use the in-component guard beforeRouteUpdate.

Detailed usage and method information can be found in Official Guide and Official API Reference.I think it's good to read .


2022-09-30 17:51

If you have any answers or tips


© 2024 OneMinuteCode. All rights reserved.