2020-11-06 路由跳转、传参

背景：一个页面中点击某个按钮，跳转到另外一个页面而且还可以传参

整体逻辑：①在路由配置文件中，配置每个页面的路径；②在需要跳转的页面引入  import {Link} from 'react-router-dom'，③使用跳转

-------------------------------------------------------------------------------------------------------------------------------------------------------方式一：使用传参

①配置路由

以上是要跳转的目标页

---

②页面引入Link

导入Link

点击路径跳转以及传参

---

备注：在路径上传参需要同时在路由配置文件中路径后面定参数，如path="/riskViewQuery/index/:id/:name" 

方式二：使用this.props.history传参

注意：前提还是要定义路由和导入路由，与上面的①②一致

①页面使用点击事件进行跳转

②跳转方法里通过this.props.history.push

注意以上：可能会报this.props.history.push  ......not  undefined，是因为当前组件没有this.props.history这个对象，所以在改组件加上如下所示：

接收参数：

①针对这种情况

接收：this.props.match.params.xxx(此处为id) ------------------接收参数

②针对这种情况

接收参数：this.props.location.state.name----------------------接收参数

③针对这种情况

---

接收参数：this.props.match.params.xxx(此处为id)    接收参数

④针对这种情况

---

接收参数：this.props.location.query.name   --------------------接收参数