[React] useEffect - setTimeout()을 사용해 3초 후 사라지는 상자 만들기
안녕하세요? 오늘은 페이지로 들어갔을 때 3초 뒤 사라지는 상자를 만들어 볼 겁니당 먼저 setTimeout() 함수란? 일정 시간이 지난 후에 원하는 함수를 실행할 수 있도록 해주는 함수이다. react 에서는 setTimeout( () => { 실행할 코드 } ); 형식으로 쓰면 됩니다! 즉 페이지가 로딩될 때 실행되어야 하므로 useEffect를 써야하고, useEffect 안에 setTimeout 함수를 써주면 된다, 1. 상자를 생성한다. 저는 3초 뒤 사라져요! 2. 나타났다가 없어지는 동적인 동작을 위해 상자의 상태를 state로 저장한다. let [showBox, SetShowBox] = useState(true); 3. useEffect 안에 페이지가 로딩된 후 실행될 코드를 작성한다. ..
React Study
2022. 8. 15. 16:14
공지사항
최근에 올라온 글
최근에 달린 댓글
- Total
- Today
- Yesterday
링크
TAG
- 리액트함수
- 리액트 filter
- map함수
- react-query
- map
- 탭만들기
- React
- state함수
- hover
- URL파라미터
- 컴포넌트
- reactQuery
- 리액트소셜로그인
- scaleX
- 리액트
- 장바구니
- 스타일컴포넌트
- 리액트쿼리
- 리액트hover
- 리액트 카테고리
- 리액트이벤트
- 리액트 애니메이션
- 리액트탭버튼
- 장바구니기능
- Props
- 리액트 hover
- API호출
- 리액트댓글
- 리액트 밑줄효과
- filter
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 | 31 |
글 보관함