react的路由传参

react路由传参的方式有好几种，接下来大概讲一下。

向路由组件传输params参数

1. 首先需要在路由组件传递oarams参数，如下：
   

2. 接下来需要在route中声明接收params参数，如下：
   

3. 然后在路由组件中接收params参数：
   

接着看实际变化和后台打印结果：
URL地址的变化：

props中接收的数据：

于是我们就可以拿到数据进行操作了。

向路由组件传输search参数

跟传输params参数一样

1. 需要在路由组件上传输search参数：
   

2. search参数不需要声明
   

3. 在路由组件中接收search参数
   在这里需要注意，因为传输过来的search参数是字符串类型，如下：

所以我们需要将字符串形式转换为key：value形式的对象，这时可以使用react中的一个库，，它的使用方法与JSON类似，一个是qs.stringify()，能将对象转换为key，value形式的字符串，中间用&连接。qs.parse()能将key，value形式并且由&连接的字符串转换为对象形式。于是我们可以这样接收search参数

完工！

URL地址的变化：

向路由组件传输state参数

1. 向路由组件中传输state参数：
   

2.state参数也不需要声明参数

3.在路由组件中接收state参数：

看看URL变化和后台打印：
URL变化;

发现没有，URL地址上面没有显示，表明会更安全一点。

后台打印：

欧了！！