react项目中路由this.props.history.pus

2018-06-22  本文已影响0人  sponing

"react-router": "^4.2.0",
"react-router-dom": "^4.2.2",

react-router版本4.x.x

在组件中js无法跳转

1、打印 this.props => {} 空对象如下
image.png
该情况下是无法利用this.props.history.push跳转的
2、正确的情况下如下
image.png

引入withRouter,并在class上面 @withRouter就可以了

import { withRouter } from 'react-router'; // 或者 是import { withRouter } from 'react-router-dom';

@withRouter
export default class ChangePasswordForm extends Component {
      // 在这里具体就可以js函数控制跳转的
      validateAllFormField()=> {
              this.props.history.push('/')
      }
}
上一篇下一篇

猜你喜欢

热点阅读