How to use onClick event on React Router Link?

Sometimes, we want to use onClick event on React Router Link.

In this article, we’ll look at how to use onClick event on React Router Link.

How to use onClick event on React Router Link?

To use onClick event on React Router Link, we can put the states we want pass between routes in the URL parameter.

For instance, we write

<Link to={"/about/" + name}>{name}</Link>;

to add the name URL parameter to the /about route.

Then we can access the name URL parameter value in the component that renders when we go to /about by using

this.props.params.name

Conclusion

To use onClick event on React Router Link, we can put the states we want pass between routes in the URL parameter.