useLinkClickHandlerdeclare function useLinkClickHandler< E extends Element = HTMLAnchorElement >( to: To, options?: { target?: React.HTMLAttributeAnchorTarget; replace?: boolean; state?: any; options?: { relative?: RelativeRoutingType }; } ): (event: React.MouseEvent<E, MouseEvent>) => void; The useLinkClickHandler hook returns a click event handler for navigation when building a custom <Link> in react-router-dom.
import { useHref, useLinkClickHandler, } from "react-router-dom"; const StyledLink = styled("a", { color: "fuchsia" }); const Link = React.forwardRef( ( { onClick, replace = false, state, target, to, ...rest }, ref ) => { let href = useHref(to); let handleClick = useLinkClickHandler(to, { replace, state, target, }); return ( <StyledLink {...rest} href={href} onClick={(event) => { onClick?.(event); if (!event.defaultPrevented) { handleClick(event); } }} ref={ref} target={target} /> ); } );