1 路由动态参数
路由定义
<Route path="/component/:id" component={Component} />
Link定义
<Link to="/component/10">toComponent</Link>
Component 组件中接收参数
this.props.match.params.id // id == 10
2 Link组件 to:String
路由定义(一般定义规则)
<Route path="/" component={Component} />
Link定义
<Link to="/?sort=name">Zillow Group</Link>
Component 组件中接收参数
this.props.location.search // search == "?sort=name"
3 Link组件 to:Object
路由定义(一般定义规则)
<Route path="/component" component={Component} />
Link定义
let obj = {
pathname: '/component',
search: '?sort=name',
query: { fromDashboard: 123 },
state: { fromDashboard: 123 }
}
<Link to="{obj}">Zillow Group</Link>
Component 组件中接收参数
this.props.location.search // search == "?sort=name"
this.props.location.query // query == { fromDashboard: 123 }
this.props.location.state // state == { fromDashboard: 123 }
注意:
1 query 在页面刷新后 会消失
2 query 和 state都是隐式传递