Skip to content
ghdtnals edited this page Apr 28, 2025 · 6 revisions

Toast

간단한 메시지를 보여주는 Toast 컴포넌트입니다.


✅ Props

이름 타입 기본값 설명
label string 표시할 텍스트
onClose function (optional) 닫기 버튼 클릭 시 실행할 함수 (선택)

🎨 렌더링 형태

  • 텍스트가 담긴 작은 박스 형태로 표시됩니다.
  • 필요 시 닫기 버튼을 클릭하여 알림을 수동으로 닫을 수 있습니다.

🧾 사용 예시

function Page() {
import { useToastStore } from "@/hooks/useToastStore";
  const { showToast } = useToastStore();
  const handleToastClick = () => {
    showToast("토스트"); 
  };
  return (
    <div>
      <div className="p-5">
        <Button onClick={handleToastClick} fullWidth className="py-[14px]">
          토스트 테스트 버튼
        </Button>
      </div>
    </div>
  );
}

📁 Components

Clone this wiki locally