action객체란?

반드시 type이란 key를 가져야 하는 객체이다. 또한 reducer로 보낼 명령이다.

그리고 dispatch란 action객체를 reducer로 보내는 전달자 함수이다.

지금 만드는 프로젝트에 필요한 액션은 어떤것이 있을까.

1. 값을 증가시키기
2. 값을 감소시키기

우선 코드를 보자

ex)

import React from "react";
import { useSelector, useDispatch } from "react-redux"; // import 해주세요.

const App = () => {
  const dispatch = useDispatch(); // dispatch를 사용할 수 있게 해주세요.
  const number = useSelector((state) => state.counter.number); // useSelector를 사용해 number를 가져와주세요.
  console.log(number);
  return (
    <div>
      {number}
      <button
        onClick={() => {
          dispatch({ type: "PLUS_ONE" }); // dispatch를 사용해 액션을 발생시켜주세요.
        }}
      >
        +1
      </button>
      <button
        onClick={() => {
          dispatch({ type: "MINUS_ONE" });
        }}
      >
        -1
      </button>
    </div>
  );
};

export default App;

여기서 const dispatch = useDispatch();를 가져 온 다음에

dispatch({ type: "PLUS_ONE" });여기 안에다가 함수처럼 불렀다.

reducer란 dispatch를 통해 전달받은 action객체를 검사하고,

조건이 일치 했을 때 새로운 상태값을 만들어내는 변화를 만들어내는 함수이다.

그리고 dispatch를 사용하기 위해서는

import { useSelector, useDispatch } from "react-redux";라는

hook을 사용해야한다.