前端vue如何在vuehttp地址栏上添加参数

前端vue如何在vuehttp地址栏上添加参数,第1张

1、使用组件来导航到/users路径。

2、通过query属性添加了一个名为name的参数,值为John。

3、这将在地址栏上显示为/usersname=John。

1.在path中添加/:id来对应 $router.push 中path携带的参数。在子组件中可以使用来获取传递的参数值。

方案一:

实现:

在组件two中点击时会将点击的城市名传递到city组件中

路由配置如下

city组件以及接收传来的参数的方式

效果

点击聊城,在跳转到city组件之后,将聊城这个参数也传递了过来。

方案二:

实现:

在组件main中点击对应的季节将该参数传递到跳转的MainD组件中

组件MainD接参

效果:

点击夏天跳转页面之后,在MainD页面显示夏天

方案三:平常最常用的一种方式

实现:

在组件list中向listDetail组件中传递对应的多个参数

路由配置

组件listDetail中以及接收参数

相当于在list组件中点击列表,在listDetail组件中,显示点击的列表项的详情

效果:

以上便是vue传参常见的三种方式


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/bake/11645757.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-17
下一篇 2023-05-17

发表评论

登录后才能评论

评论列表(0条)

保存