解决Vue编程式导航路由跳转不显示目标路径问题

林涧泣2023-11-26 23:05

我们配置一个编程式导航的路由跳转，跳转到 /search 页面，并且携带categoryName和categoryId两个query参数。

javascript 复制代码

this.$router.push({
  path: "/search",
  query: {
    categoryName: dataset.categoryname,
    categoryId: dataset.categoryid
  }
})

如果我们点击跳转，路径应该是localhost:8080/#/search?categoryName=xxx&categoryId=xxx

但是，我们点击却发现/search路径丢失了，仍然停留在home页面：

解决方法：

可能是在路由配置上出了问题

我们在search路由的配置上配置了一个params 参数占位符。

但是我们上面并没有使用params参数进行传参！

我们可以在占位符后加上一个问号，表示该参数可传可不传。

完美解决问题