DEV Community

Cover image for NavLink active ClassName using styled-components
Rom858
Rom858

Posted on

NavLink active ClassName using styled-components

npm i styled-components react-router-dom
or
yarn add styled-components react-router-dom
Enter fullscreen mode Exit fullscreen mode

slyled-navlink.js


import styled from "styled-components"


export const StyledNavLink=styled(NavLink).attrs({activeClassName:"anyClassName"})`
color: black;
&.anyClassName{
color: red;
}
`;
Enter fullscreen mode Exit fullscreen mode

*Note activeClassName accept string as className when NavLink is active so you can pass any className you like

Top comments (0)