React Router Go Back

React Router is a lightweight, fully-featured routing library for the React JavaScript library. React Router runs everywhere that React runs; on the web, on the server (using node.js), and on React Native.

• You can get access to the history object’s properties and the closest <Route>'s match via the withRouter higher-order component.
• withRouter will pass updated match, location, and history props to the wrapped component whenever it renders.

React Router Back

Wrap your App.js with the withRouter() HOC this makes history to be available appWide.

• You Can Wrap your component only makes history available for that specific component.

			
					import React from 'react';
import { withRouter } from "react-router-dom";
export default withRouter(App);

			
	

			
	
			

		
	

The useHistory hook gives you access to the history instance that you may use to navigate.

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

function BackButton({ children }) {
  let history = useHistory()
  return (
    <button type="button" onClick={() => history.goBack()}>
      {children}
    </button>
  )
}

			
	

			
	
			

		
	

react-router-dom go back

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

function BackButton({ children }) {
  let history = useHistory()
  goBack = () => history.goBack();
  return (
    <button type="button" onclick={goBack}>
      {children}
    </button>
  )
}

			
	

			
	
			

		
	

References

• withRouter
• useHistory