码迷,mamicode.com
首页 > 其他好文 > 详细

React-页面路由参数传递的两种方法

时间:2018-08-17 16:28:42      阅读:635      评论:0      收藏:0      [点我收藏+]

标签:path   导航   this   lin   com   code   detail   获取   list   

list页->detail页

方法一:路由参数

路由导航:

用“/”

<Link to={‘/detail/‘+item.get(‘id‘)} key={index}>

路由map:

加"/:id"

<Route exact path="/detail/:id" component={Detail} />

detail页获取参数:

准确的获取到id,不需要做处理

this.props.match.params.id

方法二:查询参数

路由导航:

用“?”

<Link to={‘/detail?‘+item.get(‘id‘)} key={index}>

路由map:

不加"/:id"

<Route exact path="/detail" component={Detail} />

detail页获取参数:

不能准确的获取到id,需要做处理

this.props.location.search

 

React-页面路由参数传递的两种方法

标签:path   导航   this   lin   com   code   detail   获取   list   

原文地址:https://www.cnblogs.com/superlizhao/p/9493651.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!