[React] 10-Simple-Ajax

React의 특징 브라우저에 표시되는 URL이 바뀌면 App.js부터 모든 컴포넌트가 전부 재실행됨

import { useLocation, useNavigate } from "react-router-dom";

  // 페이지 강제 이동을 위한 객체 생성
  const navigate = useNavigate();

  /** step2 - 검색폼에서의 전송 이벤트 */
  // 성능 최적화를 위해 useCallback() 적용함
  const onSearchSubmit = useCallback(
    (e) => {
      e.preventDefault();
      console.log("submit!!!");
      // 검색어를 QueryString으로 지정하여 페이지를 이동한다.
      navigate(`/department?keyword=${e.currentTarget.keyword.value}`);
    },
    [navigate]
  );