39. 컴포넌트에 "일반" JavaScript 논리 추가하기 컴포넌트를 여러 컴포넌트로 분할하기

props 안에 텍스트와 같은 고정 값을 넣어 전달하는 것도 가능하다

선생님은 toLocaleString을 모두 사용했지만 
나는 간단하게 getYear()로 년과 일자를 받아왔다

 

import './ExpenseItem.css';

function ExpenseItem(props) {

  const month = props.date.toLocaleString('en-US', { month: 'long' });
  const year = props.date.getYear() + 1900;
  const day = props.date.getDate();
  return (
    <div className="expense-item">
      <div>
        {/* {props.date.toString()} */}
        <div>{month}</div>
        <div>{year}</div>
        <div>{day}</div>
      </div>
      <div className="expense-item__description">
        <h2>{props.title}</h2>
        <div className="expense-item__price">{props.amount}</div>
      </div>
    </div>
  );
}

export default ExpenseItem;