해민

  • 홈
  • 태그
  • 방명록

3 2 1 1

[React] 버튼을 클릭하면 3 2 1 카운트다운 구현하기

오늘은 리액트를 사용하여 START 버튼을 누르면 3 2 1 카운트가 울리고0이되면 사라지는 카운트 다운을 구현해볼것이다. style 요소는 빼고 오로지 기능을 구현한 코드만 예제로 쓸것이다.1️⃣ 이벤트를 실행 시킬 버튼 생성Main 컴포넌트 onClickStart} play={play} /> Button style 컴포넌트 Button 컴포넌트는 Main에서 props로 clickEvt 와 visible을 전달 받아온다.clickEvt는 클릭 시 이벤트를 발생 시키는 함수이고, visible은 버튼의 표시 여부를 클래스이름에 담는 용도이다. play는 시작(true) 일 경우 버튼을 hide 하고 종료(false) 일 경우 버튼을 show 한다.import styled from "styled-comp..

리액트 2025.01.22
이전
1
다음
더보기
프로필사진

해민

기록하는 프로그래밍

  • 분류 전체보기 (62)
    • Java (12)
    • JavaScript (11)
    • HTML (6)
    • 알고리즘 (1)
    • CSS (3)
    • 데이터베이스 (7)
    • 리액트 (9)
    • JSP (4)
    • SpringBoot (9)

Tag

비동기, var, database, map, Let, 리액트, 동기, useState, 호이스팅, axios, react, 어노테이션, useEffect, MySQL, java, 컴포넌트, UI, javascript, Spring, const,

최근글과 인기글

  • 최근글
  • 인기글

최근댓글

공지사항

페이스북 트위터 플러그인

  • Facebook
  • Twitter

Archives

Calendar

«   2025/06   »
일 월 화 수 목 금 토
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30

방문자수Total

  • Today :
  • Yesterday :

Copyright © Kakao Corp. All rights reserved.

티스토리툴바