이제 포스트를 작성하는 API를 호출하기 위한 준비를 마쳤습니다. WriteActionButtonsContainer를 만들어서 다음과 같이 구현해 보세요.

    containers/write/WriteActionButtonsContainer.js

    import React, { useEffect } from 'react';
    import WriteActionButtons from '../../components/write/WriteActionButtons';
    import { useSelector, useDispatch } from 'react-redux';
    import { withRouter } from 'react-router-dom';
    import { writePost } from '../../modules/write';
    
    const WriteActionButtonsContainer = ({ history }) => {
      const dispatch = useDispatch();
      const { title, body, tags, post, postError } = useSelector(({ write }) => ({
        title: write.title,
        body: write.body,
        tags: write.tags,
        post: write.post,
        postError: write.postError,
      }));
    
      // 포스트 등록
      const onPublish = () => {
        dispatch(
          writePost({
            title,
            body,
            tags,
          }),
        );
      };
    
      // 취소
      const onCancel = () => {
        history.goBack();
      };
    
      // 성공 혹은 실패 시 할 작업
      useEffect(() => {
        if (post) {
          const { _id, user } = post;
          history.push(`/@${user.username}/${_id}`);
        }
        if (postError) {
          console.log(postError);
        }
      }, [history, post, postError]);
      return <WriteActionButtons onPublish={onPublish} onCancel={onCancel} />;
    };
    
    export default withRouter(WriteActionButtonsContainer);

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