네비게이션 바 NavBar

태그

Molecules

개발자

지현 김

적용 코드

JavaScript
복사

컴포넌트 구현 코드

export default function NavBar() {
return (
<>
    <Nav>
        <NavList>
            <li className="home">
                <NavLink to="/home" className={({ isActive }) => (isActive ? 'active' : '')}>
                    홈
                </NavLink>
            </li>
            <li className="chat">
                <NavLink to="/chatlist" className={({ isActive }) => (isActive ? 'active' : '')}>
                    채팅
                </NavLink>
            </li>
            <li className="post">
                <NavLink to="/postupload">게시물작성</NavLink>
            </li>
            <li className="user">
                <NavLink to="/myprofile" className={({ isActive }) => (isActive ? 'active' : '')}>
                    프로필
                </NavLink>
            </li>
        </NavList>
    </Nav>
</>
);
}
JavaScript
복사