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

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

完美解决问题

相关推荐
yuanyxh7 小时前
Mac 软件推荐
前端·javascript·程序员
万少8 小时前
AtomCode开发微信小程序《谁去呀》 全流程
前端·javascript·后端
某人辛木8 小时前
Web自动化测试
前端·python·pycharm·pytest
Kagol8 小时前
Superpowers GSD gstack AgentSkills深度测评
前端·人工智能
excel9 小时前
JavaScript 字符串与模板字面量:从表象到本质理解
前端
京东云开发者10 小时前
当AI成为导演-如何用AI创作动漫短剧
前端
李白的天不白10 小时前
使用 SmartAdmin 进行前后端开发
java·前端
乘风gg10 小时前
🤡PUA AI Coding 工具 的 10 条终极语录
前端·ai编程·claude
学Linux的语莫10 小时前
Vue 3 入门教程
前端·javascript·vue.js
怕浪猫11 小时前
第一章、Chrome DevTools Protocol (CDP) 详解
前端·javascript·chrome