1import { useState, useEffect } from "react";
2
3const delay = 5;
4
5export default function App() {
6 const [show, setShow] = useState(false);
7
8 useEffect(
9 () => {
10 let timer1 = setTimeout(() => setShow(true), delay * 1000);
11
12 // this will clear Timeout
13 // when component unmount like in willComponentUnmount
14 // and show will not change to true
15 return () => {
16 clearTimeout(timer1);
17 };
18 },
19 // useEffect will run only one time with empty []
20 // if you pass a value to array,
21 // like this - [data]
22 // than clearTimeout will run every time
23 // this value changes (useEffect re-run)
24 []
25 );
26
27 return show ? (
28 <div>show is true, {delay}seconds passed</div>
29 ) : (
30 <div>show is false, wait {delay}seconds</div>
31 );
32}
33