使用history跳转路由不能跳转的问题

使用history跳转路由不能跳转的问题

前端小白在学习react的时候，遇到了使用history跳转路由的问题，查了很多资料，最后找到了解决办法。

问题描述
对登录页面的用户名和密码input值进行验证，验证成功后页面跳转到主页面，但是在使用this.props.history.replace()时，发现并不能正常跳转，而是出现了Paused in debugger，但是并没有详细提示出了什么错，跳转代码如下：

    //对表单进行验证
    this.props.form.validateFields(async(err, values) => {
        if (!err) {
            // 请求成功  
            const {user,password} = values
            const result = await reqLogin(user,password)
            if(result.data.code === 200){
                message.success('登陆成功')
                //跳转到后台管理界面(需要回退的话用push)
                this.props.history.replace('/')
            }else{
                //提示错误信息
                message.error(result.msg)
            }
        }
        else{
            console.log('校验失败');
        }
      });

解决问题的办法

使用withRouter高阶组件

import React from "react";
import {withRouter} from "react-router-dom";
 
class MyComponent extends React.Component {
  ...
  myFunction() {
    this.props.history.push("/App/Home");
  }
  ...
}
export default withRouter(MyComponent);