React 路由传参的方式有哪些?【最全总结】

今天爱分享给大家带来React 路由传参的方式有哪些?【最全总结】,希望能够帮助到大家。

1. 直接在to属性的值后面加?跟上参数

通过this.props.location.search 可以得到?及之后的字符串,在自己进行分析

商品id:{item.goods_id}

接收: this.props.location.search //输出为 ?id=5 属性string类型

2. 使用query或params进行传值

商品id:{item.goods_id}

接收:this.props.location.query.id

商品id:{item.goods_id}

接收:this.props.location.params.id

商品id:{item.goods_id}

接收: this.props.location.state.id

同query差不多,只是属性不一样,而且state传的参数是加密的

3. 路由传参

路由的定义中,要定义参数


参数以 / 的形式加在路由后面

商品id:{item.goods_id}

接收:this.props.match.params.id

注:设置路由参数,当没有传参数时,不会显示组件,解决方法,在对应参数后面写?,

代码如下:


原文链接:https://blog.itblood.com/959.html,转载请注明出处。
0
森林之庭~小镇牧场生活~V1.2.2 内嵌AI汉化版[更新][750M] [精品RPG/汉化]
森林之庭~小镇牧场生活~V1.2.2 内嵌AI汉化版[更新][750M] [精品RPG/汉化]
3分钟前 有人购买 去瞅瞅看

站点公告

显示验证码
没有账号?注册  忘记密码?