this.props.histroy.push中 state 传参问题

问题描述

【hash路由】利用this.props.history.push() 在发起路由跳转时，将参数赋值给state传参。
【写法如下】

this.props.history.push({ pathname: '/noAccess', state: { name: "lmm"}， search: "name" });

在 /noAccess 页面下获取参数

const { location: { state = {}, search = "" } } = this.props
console.log(state) // 打印一直为空json
console.log(search) // 打印一直为name

问题思考

1. 写法没有问题，能正常获取除state以外的任何参数。（后面尝试了hash、key、search）
2. 路由能正常跳转
3. 考虑state的传参是否和其他参数不同

解决办法

后来了解到state参数的传递必须保证A、B组件在同一个Router下。
这个时候要关注项目最外层文件的router render，我的问题是使用了HashRouter 做了隔离，删除即可

后记

在路由传参中，state可以包含我们需要传递的多种参数类型，如果传参类型是JSON/Array，则state传参的首选。