react路由组件传递参数的三种方式

react路由组件传递参数的三种方式

params 参数

​ 路由链接(携带参数)：

<Link to="/demo/test/123"></Link>

​ 注册路由(接收)

注册路由(接收)：<Route path="/demo/:name/:id" component={Test}/>

​ 接收参数

   接收参数：this.props.match.params

search参数
路由链接(携带参数)

<Link to="/demo/test?name=tom&age=13"></Link>

​ 注册路由(正常注册)

<Route path="/demo/test" component={Test}></Route>

​ 接收参数

this.props.location.search

state参数

​ 路由链接

<Link to ={{path:"/demo/test",state:{name:"tom",age:18}}}></Link>

​ 注册路由（正常注册）

<Route path="/demo/test" component={Test}></Route>

​ 接收参数

this.props.location.state