Sometimes, we want to disable a Link if it’s active with React Router.

In this article, we’ll look at how to disable a Link if it’s active with React Router.

How to disable a Link if it’s active with React Router?

To disable a Link if it’s active with React Router, we set the to prop.

For instance, we write

<Link to={isActive ? "/link-to-route" : "#"} />;

to set the to prop to "#" if isActive is true.

Otherwise, we set it to "/link-to-route".

Conclusion

To disable a Link if it’s active with React Router, we set the to prop.