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

我们配置一个编程式导航的路由跳转,跳转到 /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参数进行传参!

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

完美解决问题

相关推荐
xiaobaoyu2 小时前
vue3+vite+vant4项目实战总结
前端
咖啡星人k3 小时前
【无标题】
前端·ai·github
用户83134859306983 小时前
Cesium 实现行政区内部遮罩
vue.js·webgl·cesium
颜进强3 小时前
LangChain 从入门到实践:用最小案例理解 RAG 的 5 个核心抽象
前端·后端·ai编程
颜进强3 小时前
MCP 从入门到实践:用 TypeScript 实现第一个 MCP Server
前端·后端·ai编程
申君健24864182772023 小时前
MCP TypeScript SDK v2 完整升级变化说明
javascript
卤蛋fg63 小时前
vxe-table 自定义复制粘贴逻辑:精确控制单元格数据转换
vue.js
朕的剑还未配妥3 小时前
CSS 实现渐变毛玻璃:从 backdrop-filter 到多层 mask
前端·css
Ivanqhz3 小时前
Rust Lazy浅析
java·javascript·rust
程序员黑豆3 小时前
鸿蒙开发实战:使用 List 组件构建新闻列表
前端·华为·harmonyos