chap07 HookReducer.js

0% Statements 0/7

0% Branches 0/2

0% Functions 0/3

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
22
23
24
25
26
27
28
29
30
31
32  
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
  import { useReducer } from 'react';
 
export default function HookReducer({ init }) {
  // State+Reducer 준비
  const [state, dispatch] = useReducer(
    // 감속기 기능
    (state, action) => {
      switch (action.type) {
        case 'update':
          return { count: state.count + 1 };
        default:
          return state;
      }
    },
    // State의 초깃값
    {
      count: init
    }
  );
 
  // Reducer를 통해 State 업데이트
  const handleClick = () => {
    dispatch({ type: 'update' });
  };
 
  return (
    <>
      <button onClick={handleClick}>카운트</button>
      <p>{state.count}번 클릭되었습니다.</p>
    </>
  );
}