如何为动态路由传递参数？

Question

我需要单击转到使用动态路由创建的下一页。它从 vuex 商店获取路由的 ID。当我点击它时，它会给出这个网址

http://localhost:8080/worklist/%7Bname:'worklistDynamic',%20params:%7B%20id:sideSwiperItems[indx+1].id%7D%7D
 ---------------------------------------

这是我的代码：

//html
.side-button-next(@click='switchPage()')
//function
--------------------------
switchPage() {
      this.$router.push(
        `{name:'worklistDynamic', params:{ id:this.sideSwiperItems[this.indx+1].id}}`,
      )
    },
--------------------------
computed: {
sideSwiperItems() {
  return this.$store.state.buildingData.sideSwiperItems
},
indx() {
  if (this.$store.state.buildingData.index === null) {
    return 0
  }
  return this.$store.state.buildingData.index
},

},

Answer 1

尝试删除反引号：

switchPage() {
  let path = { name: 'worklistDynamic', params: { id: this.sideSwiperItems[this.indx + 1].id } }

  // or you can write the full path with backticks and interpolation
  let path = `/worklistDynamic/${this.sideSwiperItems[this.indx + 1].id}`

  this.$router.push(path)
}