How to disable a link in React Router?

Sometimes, we want to disable a link in React Router.

In this article, we’ll look at how to disable a link in React Router.

How to disable a link in React Router?

To disable a link in React Router, we can set the pointerEvents style to 'none'.

For instance, we write

<Link to="/" style={{ pointerEvents: "none" }}>
  Test
</Link>

to set the style prop to { pointerEvents: "none" } to disable mouse pointer actions on the Link.

Conclusion

To disable a link in React Router, we can set the pointerEvents style to 'none'.