CODEWITHSUNDEEP
javascriptreactjsreact-router
nickelman
nickelman

Reputation: 742

React router link keeps pushing to history same url?

I'm using React Router 4. One concern I have is that if you use the <Link /> component to navigate between routes, lets say in your header, and you click on that same link again it will keep pushing the same url to browser history? Is there any way to prevent this behaviour, or is it completely up to me as developer to either replace that <Link /> with something something like a <span> element (if I dont want users to be able to click that link)? Or should I do my own version of the <Link /> component and then inside that prevent from firing events when on the same route?

Upvotes: 5

Views: 1488

Answers (1)

Alok Mali
Alok Mali

Reputation: 2881

Yes, agree with @MaximeGirou. You can use your own trick.

Or another way is to define a class with some CSS properties [like cursor:not-allowed etc.] and give that class name in activeClassName attribute.

<NavLink to="/dashboard" activeClassName="linkActive">
   <i className="icon icon-home" /> <span>Dashboard</span>
</NavLink>

Upvotes: 4

Related Questions