diff --git a/src/pages/Header.js b/src/pages/Header.js index 164a4200f9ef34f29f16a9d721845f87f3033e83..034328b376f50285c16d55fe72e6c615de3f2bce 100644 --- a/src/pages/Header.js +++ b/src/pages/Header.js @@ -1,6 +1,26 @@ import React from 'react'; import header_styles from './Header.module.css'; +import { useNavigate } from "react-router-dom"; + const Header=()=>{ + const navigate = useNavigate(); + + const goToHome = () => { + navigate("/"); + } + + const goToSearch = () => { + navigate("/search"); + } + + const goToClientservice = () => { + navigate("/clientservice"); + } + + const goToMypage = () => { + navigate("/mypage"); + } + return ( <header> <div className={header_styles.header_content}> @@ -8,11 +28,11 @@ const Header=()=>{ <div className={header_styles.header_logo}><a href="/"><img src="/planpuzzle_logo.png"></img></a></div> <nav className={header_styles.header_nav}> <ul> - <li><a href="/">홈</a></li> - <li><a href="/search">검색</a></li> - <li><a href="/clientservice">고객지원</a></li> - <li><a href="/mypage">마이페이지</a></li> - <li><a href="#logout"><img src="/logout_img.png"></img></a></li> + <li onClick={goToHome}><a>홈</a></li> + <li onClick={goToSearch}><a>검색</a></li> + <li onClick={goToClientservice}><a>고객지원</a></li> + <li onClick={goToMypage}><a>마이페이지</a></li> + <li><a><img src="/logout_img.png"></img></a></li> </ul> </nav>