If you’ve created several Routes within your application, you will also want to be able to navigate between them. React Router supplies a Link component that you will use to make this happen.

Import Link:

import {    BrowserRouter as Router,    Route, Link} from 'react-router-dom';

 

Add Nav section to the page

const Nav = () => (  
     
      
      Home      
      About      
      Contact  
     
);

There are two ways to nav to another page.

 

1. to="/about"

2. to={

{pathname: '/contact'}}

 

Here the 'replace' keyword able to help modify pushHistory. Once you use 'replace' it will replace previous state to current state, instead of add one state.

For example.

Current history: ['/', '/about', '/contact'], in the normal case, you hit the 'Back' button in your browser it will bring you back to '/about'.

But once you use 'replace', it will replace ['/', '/about'] to ['/', '/contact']. So you when hit 'Back' button , you will back to '/'.