useToggle

boolean 타입의 state를 Toggle로 쉽게 사용할 수 있는 커스텀 훅 입니다.

Code

🔗 실제 구현 코드 확인

Interface

typescript

function useToggle(defaultValue?: boolean): [boolean, () => void]

Options

Name	Type	Default	Description
defaultValue	boolean	false	토글의 초기 boolean 값

Returns

Name	Type	Description
[0]	boolean	현재 토글 상태
[1]	() => void	토글 상태를 전환하는 함수

Usage

typescript

import { useToggle } from '@modern-kit/react';

const Example = () => {
  const [bool, toggle] = useToggle(false);

  return (
    <div>
      {bool && <p>render</p>}
      <button onClick={toggle}>Toggle Button</button>
    </div>
  );
}