Function usePageTransition

페이지 전환 애니메이션을 관리하는 커스텀 훅입니다.

Description

페이지 전환 시 애니메이션을 자연스럽게 처리하며, 라우팅과 상태 관리를 캡슐화합니다. 필수로 PixelTransitionContainer 컴포넌트와 함께 사용해야 합니다.

Example

const MyPage = () => {
  const { isExiting, transitionTo } = usePageTransition();

  const handleNavigate = () => {
    transitionTo('/next-page');
  };

  return (
    <PixelTransitionContainer isExiting={isExiting}>
      <button onClick={handleNavigate}>다음 페이지로</button>
    </PixelTransitionContainer>
  );
};
  • usePageTransition(options?): {
        isExiting: boolean;
        transitionTo: ((path: string) => void);
    }

  • Parameters

    • options: UsePageTransitionOptions = {}

      페이지 전환 옵션

    Returns {
        isExiting: boolean;
        transitionTo: ((path: string) => void);
    }

    전환 상태와 페이지 전환 함수를 포함하는 객체

    • isExiting: boolean

      현재 페이지가 전환 중인지 여부

    • transitionTo: ((path: string) => void)

      지정된 경로로 애니메이션과 함께 페이지를 전환합니다

        • (path): void

        • Parameters

          • path: string

            이동할 페이지의 경로

          Returns void

Settings

Member Visibility