Gibt es eine Möglichkeit, die Routenstütze in Vue festzulegen?

Question

Ich möchte zu einer bestimmten Registerkarte auf der Seite navigieren

this.$router.push({
        name: "AdminNotifications",
        params: { tab: "requests" },
      })

So kann ich innerhalb der Seite die Parameter abrufen und die Registerkarte festlegen:

mounted() {
    const routeTab = this.$route.params.tab;
    if (routeTab) this.tab = routeTab;
  }

Gültig, wenn die aktuelle Seite nicht AdminNotifications ist.

Aber zusätzlich gibt es einen Fehler: NavigationDuplicated：避免了到当前Redundante Navigation

Also... gibt es eine Möglichkeit, einfach das Attribut tab ohne Navigation festzulegen?

Danke

Answer 1

如果您已经到达某个路线，则无法导航至该路线。但是，既然您已经在那里，您只需将 this.tab 设置为所需的值即可：

if (this.$route.name === 'AdminNotifications') {
  this.tab = 'requests';
} else {
  this.$router.push({
    name: "AdminNotifications",
    params: { tab: "requests" },
  })
}

---

如果负责导航的组件与包含 tab 的组件不同，您可以将 tab 参数推送到 $route：

if (this.$route.name === 'AdminNotifications') {
  this.$router.replace({
    params: { tab: "requests" }
  });
} else {
  this.$router.push({
    name: "AdminNotifications",
    params: { tab: "requests" },
  })
}

在页面组件中，将 mounted 中的“watcher”替换为适当的监视程序，该监视程序将 tab 动态设置为 $route.params.tab 的任何真值：

watch: {
  '$route.params.tab': {
    handler(val) {
      if (val) {
        this.tab = val;
      }
    },
    immediate: true
  }
}