-1

In React Router, we use a hook useNavigate() to programmatically navigate to various pages of our website.

For example, our website has 3 components Home, New, Recommended. Now, let's say I navigated from Home to New and then from New to Recommended. Now, if I call the hook navigate(-1), it will navigate me to New section.

My question is, where is this history stored in the browser? And, where can I see this history in chromes inspect developer tools?

henk
  • 2,677
  • 2
  • 18
  • 49
Manas Telavane
  • 31
  • 4

1 Answers1

0

React Router uses the window.history api under the hood, which is standardized among browsers.

It is a global object, that you can access in the browser's console.

Read more about the history object here

enter image description here

My question is, where is this history stored in the browser?

Most probably somewhere in the browser's memory and it depends on the browser's internal implementation. But all browsers expose a part of this history through the history object to the webpage.

And, where can I see this history in chromes inspect developer tools?

It is not possible to see the visited paths. That would expose the whole browser history of the user to the webpage. Browsers won't allow that for obvious security and data protection reasons. But you could store the visited subpages of your page in the history objects state and access those paths according to your needs.

henk
  • 2,677
  • 2
  • 18
  • 49
  • Thanks for this. But for example, If I navigate from localhost:3000/ to localhost:3000/new. And Then from localhost:3000/new to localhost:3000/recommended. So, Where is this localhost:3000/new for back() and localhost:3000/ for go(-2) stored in that entire History object? I can see the length of history object increasing when I navigate to various components, but I cannot specifically see the link localhost:3000/new or localhost:3000/recommended in that object. Thanks in advance. – Manas Telavane Jul 04 '22 at 14:14
  • That is not possible unless you store it somewhere on your own. See my edited answer. – henk Jul 04 '22 at 14:54