방금 작성한 방법보다 한 가지 더 편한 방법이 있습니다. 바로 mapDispatchToProps에 해당하는 파라미터를 함수 형태가 아닌 액션 생성 함수로 이루어진 객체 형태로 넣어 주는 것입니다. 다음과 같이 말이죠.

    containers/CounterContainer.js

    import React from 'react';
    import { connect } from 'react-redux';
    import Counter from '../components/Counter';
    import { increase, decrease } from '../modules/counter';
    
    const CounterContainer = ({ number, increase, decrease }) => {
      return (
        <Counter number={number} onIncrease={increase} onDecrease={decrease} />
      );
    };
    
    export default connect(
      state => ({
        number: state.counter.number,
      }),
      {
        increase,
        decrease,
      },
    )(CounterContainer);

     

    위와 같이 두 번째 파라미터를 아예 객체 형태로 넣어 주면 connect 함수가 내부적으로 bindActionCreators 작업을 대신해 줍니다.

    신간 소식 구독하기
    뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.