I want to navigate to a specific tab in the page
this.$router.push({ name: "AdminNotifications", params: { tab: "requests" }, })
So within the page I can get the parameters and set the tab:
mounted() { const routeTab = this.$route.params.tab; if (routeTab) this.tab = routeTab; }
Valid if the current page is notAdminNotifications.
But in addition, there is an error:NavigationDuplicated: Avoids redundant navigation to the current
So...is there a way to just set thetabattribute without navigation?
Thanks
You cannot navigate to a route if you have already reached it. But now that you're already there, you can just set
this.tabto the value you want:if (this.$route.name === 'AdminNotifications') { this.tab = 'requests'; } else { this.$router.push({ name: "AdminNotifications", params: { tab: "requests" }, }) }If the component responsible for navigation is different from the component containing
tab, you can push thetabparameter to$route:if (this.$route.name === 'AdminNotifications') { this.$router.replace({ params: { tab: "requests" } }); } else { this.$router.push({ name: "AdminNotifications", params: { tab: "requests" }, }) }In the page component, replace "watcher" in
mountedwith an appropriate watcher that dynamically setstabto$route.params. Any truth value of tab:watch: { '$route.params.tab': { handler(val) { if (val) { this.tab = val; } }, immediate: true } }