在 Vue 3 路由器中更改参数

Question

我试图用 Vue 路由器更改路由参数。我的路线如下：

/document/:id?/:lang?/edit

id和lang（语言）为参数。我想使用 JavaScript 更改参数 lang 而不改变路线的其余部分。我尝试应用以下解决方案（发现）。该解决方案是为 Vue 2 而不是 3 制作的。所以我尝试制作更新版本。这是我的代码：

let params = this.$route.params
params.lang = 'en'
this.$router.push({params:params})

当我执行我的代码时，路由参数没有变化，控制台中也没有记录错误。有谁知道 Vue 3 中这个问题的解决方案。

提前致谢。

Answer 1

像这样更改路由参数是一种糟糕的方法。

相反，将您的路线替换为相同的 name、相同的 id，但不同的 lang:

  this.$router.replace({
    name: this.$route.name,
    params: {
      id: this.$route.params.id,
      lang: 'en' // or whatever you want
    }
  })

如果需要，请不要忘记注意路线变化：

  watch: {
    $route(to, from) {
      // if anything needs to be done when the route changes
    }
  }

在 Vue 3 路由器中更改参数

Changing a parameter in Vue 3 router

javascript

router

vue-router

vuejs3