chap07 StateEffect.js

0% Statements 0/8

100% Branches 0/0

0% Functions 0/4

0% Lines 0/7

Press n or j to go to the next uncovered block, b, p or k for the previous block.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21  
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
  import { useEffect, useState } from 'react';
 
export default function StateEffect({ init }) {
  const [count, setCount] = useState(init);
  const [foo, setFoo] = useState('foo');
 
  // State 값(count)이 변경된 경우에만 로그를 표시한다.
  useEffect(() => {
    console.log(`count is ${count}.`);
  }, []);
  const handleClick = () => setCount(count + 1);
 
  return (
    <>
      {/* 버튼에 타임스탬프 값 반영 */}
      <button onClick={() => setFoo(Date.now())}>Foo ({foo})</button>
      <button onClick={handleClick}>카운트</button>
      <p>{count}번 클릭되었습니다.</p>
    </>
  );
}