Passing Props to a Link

Learn about the various kinds ofprops used with link components, and implement them in a React application.

The <Link /> component has several props other than the to prop, including replace, state, and reloadDocument. You’ll learn more about each of them in this lesson.

The to prop

The to prop makes changes in the URL. It can accept a string or an object as a value. Let’s learn more by reviewing some examples.

to: string

A string representation of a location or URL can be passed as the to prop as follows:

<Link to="/home">Home</Link>

We use string representation in cases where we don’t need to pass search queries, such as navigation links or links that redirect to other pages.

to: object

An object can be passed as the to prop. This object can have one or more of the following properties:

  • pathname: A string representing the path or URL.
  • search: A query string (URL parameters).
  • hash: A hash value in the URL.
  • state: A signal to pass data to the location.

Get hands-on with 1200+ tech skills courses.