更改 Vue 3 路由器中的参数答案

【问题标题】：Changing a parameter in Vue 3 router更改 Vue 3 路由器中的参数
【发布时间】：2022-01-12 19:34:19
【问题描述】：

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

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

Id 和 lang（语言）是参数。我想使用 JavaScript 更改参数 lang 而不更改路由的其余部分。我尝试应用以下解决方案（找到here）。该解决方案是针对 Vue 2 而不是 3。所以我尝试制作一个更新版本。这是我的代码：

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

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

提前致谢。

【问题讨论】：

标签： javascript vue-router vuejs3 router

【解决方案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
    }
  }

【讨论】：