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

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

完美解决问题

相关推荐
网络点点滴10 分钟前
Vue3路由params参数
前端·javascript·vue.js
hqk13 分钟前
鸿蒙 ArkUI 从零到精通:基础语法全解析
android·前端·harmonyos
wordbaby40 分钟前
React Native (Expo) iOS 真机调试失败排查:xcodebuild exited with error code 65
前端·react native
今天也很困1 小时前
解决浏览器后台定时器降频问题:用 Worker 实现高精度 setInterval
前端
只与明月听1 小时前
一次uniapp问题排查
前端·javascript·vue.js
Bacon1 小时前
Vitest 一个基于 Vite 的快速单元测试框架
前端
学不动学不明白1 小时前
AES-GCM 解密失败解决方案
前端
一水鉴天1 小时前
整体设计 定稿 之16 三层智能合约体系实现设计和开发的实时融合
前端·人工智能·架构·智能合约
小菜今天没吃饱1 小时前
DVWA-XSS(Reflected)
前端·xss·dvwa
孟祥_成都1 小时前
前端下午茶!看看炫酷的动画,轻松一下!
前端·动效