vue.js怎么通过地址栏传参?子页面如何接收?

 时间:2026-04-23 11:37:24

1、首先,明确需求,点击订单编号,进入订单详细页,如下图:

vue.js怎么通过地址栏传参?子页面如何接收?

2、打开项目代码,找到需要路由跳转的页面代码,写一个点击事件,如下图:

vue.js怎么通过地址栏传参?子页面如何接收?

3、写入跳转内容,并传递参数,

this.$router.push({
   path: '/order/ordDetail',
   query: { id: oid, type: this.queryParams.orderType.value}
})

如下图:

vue.js怎么通过地址栏传参?子页面如何接收?

4、找到子页面,接收参数,传入对应的参数,查询详情信息,this.$route,接收参数,如下图:

vue.js怎么通过地址栏传参?子页面如何接收?

5、访问操作,就会发现地址栏上带上了你传入的参数,并且成功完成需求,如下图:

vue.js怎么通过地址栏传参?子页面如何接收?

  • javascript怎样用正则表达式分割字符串?
  • 苍之骑士团2最强角色阵容推荐
  • eclipse导入外部jar包
  • 怎么设置微信开发者工具字体
  • 如何利用HTML5和CSS3制作图片列表并展示效果
  • 热门搜索
    怎么折纸飞机飞得远 哥窑瓷器特点 黄褐斑怎么消除 武魂怎么样 哪里可以看一路向西 周边旅游景点大全 贵州旅游攻略景点必去 搭档英语怎么说 湖南文理学院怎么样 十三陵旅游攻略