search
  • Sign In
  • Sign Up
Password reset successful

Follow the proiects vou are interested in andi aet the latestnews about them taster

1 answers
Q&A Is there a way to set the route prop in vue?
Is there a way to set the route prop in vue?
P粉919464207 2024-04-06 11:35:59 Views 1075

0

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 not AdminNotifications.

But in addition, there is an error: NavigationDuplicated: Avoids redundant navigation to the current

So...is there a way to just set the tab attribute without navigation?

Thanks

Your Answer
submit

1 answers
0

You cannot navigate to a route if you have already reached it. But now that you're already there, you can just set this.tab to 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 the tab parameter 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 mounted with an appropriate watcher that dynamically sets tab to $route.params. Any truth value of tab:

watch: {
  '$route.params.tab': {
    handler(val) {
      if (val) {
        this.tab = val;
      }
    },
    immediate: true
  }
}
2024-04-07 09:29:13

submit

Popular tool

vc9-vc14 (32+64 bit) runtime library collection (link below)

vc9-vc14 (32+64 bit) runtime library collection (link below)

Download the collection of runtime libraries required for phpStudy installation

VC9 32-bit

VC9 32-bit

VC9 32-bit phpstudy integrated installation environment runtime library

PHP programmer toolbox full version

PHP programmer toolbox full version

Programmer Toolbox v1.0 PHP Integrated Environment

VC11 32-bit

VC11 32-bit

VC11 32-bit phpstudy integrated installation environment runtime library

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use