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

2025-10-10 14:46:57

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怎么通过地址栏传参?子页面如何接收?

声明:本网站引用、摘录或转载内容仅供网站访问者交流或参考,不代表本站立场,如存在版权或非法内容,请联系站长删除,联系邮箱:site.kefu@qq.com。
猜你喜欢