액션을 추가한 뒤에는 PostViewerContainer를 다음과 같이 수정해 보세요.
containers/post/PostViewerContainer.js
import React, { useEffect } from 'react'; import { useDispatch, useSelector } from 'react-redux'; import { withRouter } from 'react-router-dom'; import { readPost, unloadPost } from '../../modules/post'; import PostViewer from '../../components/post/PostViewer'; import PostActionButtons from '../../components/post/PostActionButtons'; import { setOriginalPost } from '../../modules/write'; const PostViewerContainer = ({ match, history }) => { // 처음 마운트될 때 포스트 읽기 API 요청 const { postId } = match.params; const dispatch = useDispatch(); const { post, error, loading, user } = useSelector(({ post, loading, user }) => ({ post: post.post, error: post.error, loading: loading['post/READ_POST'], user: user.user, })); useEffect(() => { dispatch(readPost(postId)); // 언마운트될 때 리덕스에서 포스트 데이터 없애기 return () => { dispatch(unloadPost()); }; }, [dispatch, postId]); const onEdit = () => { dispatch(setOriginalPost(post)); history.push('/write'); }; return ( <PostViewer post={post} loading={loading} error={error} actionButtons={<PostActionButtons onEdit={onEdit} />} ownPost={user && user.id = = = post && post.id} /> ); }; export default withRouter(PostViewerContainer);