더북(TheBook)

이 컴포넌트에서는 포스트 등록 버튼을 누르면 현재 리덕스 스토어 안에 들어 있는 값을 사용하여 새 포스트를 작성합니다. 그리고 history 객체를 사용하여, 취소 버튼을 누르면 브라우저에서 뒤로 가기를 하도록 만들었습니다. 라우트가 아닌 컴포넌트에서 history 객체를 사용하기 위해 withRouter로 컴포넌트를 미리 감싸 준 다음에 컨테이너를 만들어 주었습니다.

포스트 작성이 성공했을 때는 서버에서 응답한 포스트 정보의 _idusername 값을 참조하여 포스트를 읽을 수 있는 경로를 만든 뒤, history.push를 사용하여 해당 경로로 이동합니다.

컴포넌트를 다 만들었으면 WritePage에서 기존 WriteActionButtons 컴포넌트를 WriteAction ButtonsContainer로 대체시키세요.

pages/WritePage.js

import React from 'react';
import Responsive from '../components/common/Responsive';
import EditorContainer from '../containers/write/EditorContainer';
import TagBoxContainer from '../containers/write/TagBoxContainer';
import WriteActionButtonsContainer from '../containers/write/WriteActionButtonsContainer';

const WritePage = () => {
  return (
    <Responsive>
      <EditorContainer />
      <TagBoxContainer />
      <WriteActionButtonsContainer />
    </Responsive>
  );
};

export default WritePage;

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