title: Prevent browser back button for a specific page only in react
body: <p>I am trying to prevent browser back button for a specific page only in react redux project.  Lets say I have four pages.</p>
  
  <p><code>http://localhost:3000/abc/#/page1</code>, </p>
  
  <p><code>http://localhost:3000/abc/#/page2</code>, </p>
  
  <p><code>http://localhost:3000/abc/#/page3</code> </p>
  
  <p>and <code>http://localhost:3000/abc/#/page4</code> </p>
  
  <p>etc</p>
  
  <p>For all the pages user can go back and forth except <code>page4</code>. Once user has visited <code>page3</code> and clicked the next button he can not go back.</p>
  
  <p>I have tried multiple options but none of them is working as expected. Below code is working as per my expectation but its blocking browser back for all the pages.</p>
  
  <pre><code>componentDidMount() {
     window.history.pushState(null, document.title, window.location.href);
     window.addEventListener('popstate', function (event){
         window.history.pushState(null, document.title,  window.location.href);
     });
  }
  </code></pre>