더북(TheBook)

방금 만든 AskModal을 기반으로 post 디렉터리에 AskRemoveModal이라는 컴포넌트를 만들어 보세요.

components/post/AskRemoveModal.js

import React from 'react';
import AskModal from '../common/AskModal';

const AskRemoveModal = ({ visible, onConfirm, onCancel }) => {
  return (
    <AskModal
      visible={visible}
      title="포스트 삭제"
      description="포스트를 정말 삭제하시겠습니까?"
      confirmText="삭제"
      onConfirm={onConfirm}
      onCancel={onCancel}
    />
  );
};

export default AskRemoveModal;

 

AskRemoveModal 컴포넌트를 굳이 이렇게 별도의 파일로 분리하여 만들어 줄 필요는 없습니다. 그냥 모달을 사용하는 곳에서 AskModal을 직접 렌더링해도 상관없습니다. 다만, 모달별로 이렇게 파일을 만들어 주면 나중에 모달의 개수가 많아졌을 때 관리하기가 매우 편해집니다.

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