解决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参数进行传参!

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

完美解决问题

相关推荐
kyriewen2 小时前
我手写了一个 EventEmitter,面试官追问了 6 个问题——第 4 个我没答上来
前端·javascript·面试
IT_陈寒2 小时前
Java的Date类又坑了我一次,改用时间戳真香
前端·人工智能·后端
山河木马2 小时前
矩阵专题2-怎么创建视图矩阵(uViewMatrix)
javascript·webgl·计算机图形学
小林攻城狮2 小时前
使用 Transport 节流解决 Vercel AI SDK 流式渲染卡死问题
前端·react.js
前端缘梦3 小时前
告别 TS 运行时类型漏洞!Zod 完整入门实战教程(前端 / 全栈必备)
前端·react.js·全栈
the_answer3 小时前
Webpack vs Vite 深度对比分析
前端·webpack
转转技术团队3 小时前
验证码识别实战:前端不写页面,改训模型了?
前端
MomentYY3 小时前
Temperature:AI 的“脑洞旋钮”
前端·llm·ai编程
远航_3 小时前
OpenSpec 完整详细介绍
前端·后端
召钱熏4 小时前
状态枚举正确≠渲染正确:一个语音按钮的状态机边界修复实录
android·前端