useToggle

boolean 값을 토글(true/false 전환)하는 기능을 제공하는 Hook입니다. 스위치, 드롭다운, 모달 등의 UI 상태를 관리할 때 유용합니다.

Props

이름타입설명기본값
defaultValueboolean토글의 초기값false

Return

useToggle은 튜플 [boolean, () => void]을 반환합니다.

  • value: 현재 토글 상태 (boolean)
  • toggle: 상태를 반전시키는 함수 (() => void)

Example

모달 표시/숨기기

import { useToggle } from '@teamsparta/react';
 
function Component() {
  const [opened, toggle] = useToggle(false);
 
  return (
    <div>
      <button onClick={toggle}>토글</button>
      <p>{opened ? '열림' : '닫힘'}</p>
    </div>
  );
}