How can I use history.push('path') in react router 5.1.2 in stateful component?

Question

How can I use history.push('path') in react router 5.1.2 in stateful component (class component)?

I found this, but it is a solution for a stateless component.

import { useHistory } from "react-router-dom";

function App() {
  let history = useHistory();
}

Answer 1

I had the same issue when using react router v5. When trying to change route programmatically below,

this.props.history.push({
    pathname: `/target-path`,
    state: variable_to_transfer
});

this.props.history was undefined.

Here is my solution for react router v5.

import React, { Component } from "react";
import { withRouter } from 'react-router-dom';

class MyClass extends Component {
    routingFunction = (param) => {
        this.props.history.push({
            pathname: `/target-path`,
            state: param
        });
    }
    ...
}
export default withRouter(MyClass);

Here is reference article. Hope it helps you save your time.

Update for Next.js
You should use withRouter from 'next/router' in Next.js.

import React, { Component } from "react";
import { withRouter } from 'react-router-dom';

class MyClass extends Component {
  routingFunction = (param) => {
     this.props.router.push('/dashboard');
  }
  ...
}
export default withRouter(MyClass);