今天，我們要討論的是react router中Link傳值的三種表現形式。分別為通過通配符傳參、query傳參和state傳參。
ps:進入正題前，先說明一下，以下的所有內容都是在react-router V4的版本下。
1.通配符傳參
Route定義方式：
<Route path='/path/:name' component={Path}/>
Link組件：
<Link to="/path/通過通配符傳參">通配符</Link>
參數獲取：
this.props.match.params.name
注意這個match,許多博客活文章都是忽略了它，導致取不到值。這里的this.props.match.params.name === ‘通過通配符傳參’。
優點:簡單快捷,並且，在刷新頁面的時候，參數不會丟失。
缺點:只能傳字符串，並且，如果傳的值太多的話，url會變得長而丑陋。
如果，你想傳對象的話，可以用JSON.stringify(),想將其轉為字符串，然后另外的頁面接收后，用JSON.parse()轉回去。這里簡單提一下，不贅述。
2.query
Route定義方式：
<Route path='/query' component={Query}/>
Link組件：
var query = {
pathname: '/query',
query: '我是通過query傳值 '
}
<Link to={query}>query</Link>
參數獲取：
this.props.location.query
這里的this.props.location.query === '我是通過query傳值'
優點：優雅，可傳對象
缺點：刷新頁面，參數丟失
3.state
Route定義方式：
<Link to={state}>state</Link>
Link組件：
var state = {
pathname: '/state',
state: '我是通過state傳值'
}
<Route path='/state' component={State}/>
參數獲取：
this.props.location.state
這里的this.props.location.state === '我是通過query傳值'
優點：優雅，可傳對象
缺點：刷新頁面，參數丟失
以下，是我github上demo的地址，各位可以親自嘗試一下