active prop to add active styles to
NavLink. You can customize active styles with
To create nested links put
NavLink as children of another
NavLink is a polymorphic component – its default root element is
a, but it can be changed to any other element or component with
You can also use components in
component prop, for example, Next.js
Polymorphic components with TypeScript
Note that polymorphic components props types are different from regular components – they do not extend HTML element props of the default element. For example,
NavLinkPropsdoes not extend
ais the default element.
If you want to create a wrapper for a polymorphic component that is not polymorphic (does not support
componentprop), then your component props interface should extend HTML element props, for example:
If you want your component to remain polymorphic after wrapping, use
createPolymorphicComponentfunction described in this guide.