在React-Router中传递history.push中的状态可以通过以下步骤实现:
withRouter
高阶组件来包装组件,以便获取history
对象。import { withRouter } from 'react-router-dom';
class YourComponent extends React.Component {
// ...
}
export default withRouter(YourComponent);
this.props.history.push
来进行路由跳转,并通过第二个参数传递状态对象。this.props.history.push('/your-route', { yourState: 'yourValue' });
this.props.location.state
来获取传递的状态对象。class YourTargetComponent extends React.Component {
componentDidMount() {
const { yourState } = this.props.location.state;
// 使用传递的状态对象进行相应的操作
}
// ...
}
通过以上步骤,你可以在React-Router中成功传递history.push
中的状态。请注意,这种方式只适用于在路由跳转时传递简单的状态对象,如果需要传递复杂的数据或者在不同组件之间共享状态,可以考虑使用状态管理库(如Redux)或者上下文(Context)来实现。
领取专属 10元无门槛券
手把手带您无忧上云