이 컴포넌트에서는 포스트 등록 버튼을 누르면 현재 리덕스 스토어 안에 들어 있는 값을 사용하여 새 포스트를 작성합니다. 그리고 history 객체를 사용하여, 취소 버튼을 누르면 브라우저에서 뒤로 가기를 하도록 만들었습니다. 라우트가 아닌 컴포넌트에서 history 객체를 사용하기 위해 withRouter로 컴포넌트를 미리 감싸 준 다음에 컨테이너를 만들어 주었습니다.
포스트 작성이 성공했을 때는 서버에서 응답한 포스트 정보의 _id와 username 값을 참조하여 포스트를 읽을 수 있는 경로를 만든 뒤, 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;