注意: 路由表改變後要重啓服務
方式 一:
通過params
1.路由表中
<Route path=' /user/:id ' component={User}></Route>
2.Link處
HTML方式
<Link to={ ' /user/ ' + ' 2 ' } activeClassName='active'>XXXX</Link>
JS方式
this.props.history.push( '/user/'+'2' )
3.user頁面
通過 this.props.params.id 就可以接受到傳遞過來的參數(id)
方式 二:
通過query
前提:必須由其他頁面跳過來,參數纔會被傳遞過來
注:不需要配置路由表。路由表中的內容照常:<Route path='/user' component={User}></Route>
1.Link處
HTML方式
<Link to={{ pathname: ' /user' , query : { day: 'Friday' }}}>
JS方式
this.props.history.push({ pathname : '/user' ,query : { day: 'Friday'} })
2.user頁面
this.props.location.query.day
方式 三:
通過state
同query差不多,只是屬性不一樣,而且state傳的參數是加密的,query傳的參數是公開的,在地址欄
1.Link 處
HTML方式:
<Link to={{ pathname : ' /user' , state : { day: 'Friday' }}}>
JS方式:
this.props.history.push({ pathname:'/user',state:{day : 'Friday' } })
2.user頁面
this.props.location.state.day
---------------------
作者:IT農工-Don
來源:CSDN
原文:https://blog.csdn.net/qq_24504591/article/details/78973633
版權聲明:本文爲博主原創文章,轉載請附上博文鏈接!