0

I have been developing a React Application which is working perfectly. I have a navigation bar that has links to different pages. What I want is that if the same page is clicked again from the navigation bar, I need React to reload the page. Right now if I click on the same page link, it doesn't refresh. It renders again when there is an update in the state. But I want it to reload when the location change for the react-router is same.

Rahul Raj
  • 41
  • 7
  • why do you want to achieve this? Not reloading the page in this case is intended behaviour – messerbill May 01 '20 at 14:16
  • @messerbill I have nested rendering inside the react page. Based on certain conditions, rendering on the page is updated. Now when the page link from the navbar is clicked, the page shows the same conditional rendering. I want it to show what it had at the start when the page was initially loaded. – Rahul Raj May 01 '20 at 14:25
  • Does this answer your question? [react router Link doesn't cause rerender when visited on the same path](https://stackoverflow.com/questions/52099437/react-router-link-doesnt-cause-rerender-when-visited-on-the-same-path) – messerbill May 01 '20 at 14:58
  • @messerbill Thank you for the link. I already checked this thread. It's a bit different from what I am trying to achieve. – Rahul Raj May 01 '20 at 15:18

1 Answers1

0

I think easy solution would be reloading the current page with js. 

// if you want to reload the current page
window.location.reload(); 

// if you want to change the page
window.location.href="/path/to/another-page"
  • this is not really an answer to the OPs question – messerbill May 01 '20 at 14:30
  • I tried this already. The problem with this is that it refreshes all the pages whenever I navigate to any other page using the navbar. React-Router is working perfectly when there is a route change to a different path. I just want it to render the initial state when the path is the same. – Rahul Raj May 01 '20 at 14:41
  • @messerbill You don't know the answer but you know what it is not. He already tried what have suggested. I understand his issue and i would be helpful if i could see some code. –  May 01 '20 at 14:58
  • 1
    @CiBoz. I just hacked together a function using your code. Thanks. It checks if the pathname is the same so it reloads the page, otherwise it follows the same procedure of react-router. – Rahul Raj May 01 '20 at 15:21
  • @CiBoz *Refresh Page in React App if Location Change is same using React-Router* where exactly do you use the react router here? My comment was not a blame and i did not downvote either. The OP searches for a way to force the react router to reload the page on trying to visit the same route by clicking on a menu link or smth similar imho. – messerbill May 01 '20 at 15:54
  • @RahulRaj I am happy that you have found the solution! If your project is not a very private one, you can share the repo with me and i may be able to contribute. cihangirrbozzd@gmail.com –  May 01 '20 at 16:22
  • 1
    @CiBoz I would really love to share the project with you for contribution. It's just that I am currently working on it. I would share the repo once I am done though. Thanks – Rahul Raj May 02 '20 at 03:02