[React] NavLink : Link 에 스타일 적용

 

 

💡 NavLink 태그에 대해 알아보자.

 

Link 를 NavLink 로 바꾸면 인라인 스타일을 적용할 수 있게 된다.

<li>
  <NavLink to="/courses" style={getLinkStyle}>
    카탈로그
  </NavLink>
</li>
<li>
  <NavLink to="/questions" style={getLinkStyle}>
    커뮤니티
  </NavLink>
</li>

 

 

선택한 메뉴에 밑줄이 그어지게 만들어주기..!

function getLinkStyle({ isActive }) {
  return {
    textDecoration: isActive ? 'underline' : undefined,
  };
}