其他分享
首页 > 其他分享> > react路由传参的几种方式

react路由传参的几种方式

作者:互联网

发送
1.params
     <li key={item.id}><Link to={`/home/message/detail/${item.id}/${item.titile}`}>{item.titile}</Link></li>
2. search
      <li key={item.id}><Link to={`/home/message/detail?id=${item.id}&title=${item.titile}`}>{item.titile}</Link></li>
3.state 
    <li key={item.id}><Link to={{path:'/home/message/detail',state:{id:item.id,titile:item.titile}}}>{item.titile}</Link></li>


声明
1.params 路由声明
<Route path="/home/message/detail/:id/:title" component={detail}/>
2.search 不用声明
<Route path="/home/message/detail/" component={detail}/> 
3.state 不用声明
<Route path="/home/message/detail" component={detail}/>


接受
1. const {params} = this.props.match
2.const {search} = this.props.location
3.const {id,titile} = this.props.location.state

标签:传参,detail,react,item,state,home,id,路由,titile
来源: https://blog.csdn.net/skxx123/article/details/113832643