3.To Do List Date Component

3.Date() 함수 사용해 날짜 가져오기

 this.state = {
      today: new Date(),
      now: 0,
    };

state로 today로 new Date()를 받고 now: 0으로 기준을 잡는다.

handleClickDate = (arrow) => {
    const { now } = this.state;
this.setState(() => ({
      now: now + (arrow === "right" ? 1 : -1),
    }));
  };

화살표 click시 방향에 따라 - , +로 now의 상태를 변화 시킨다.

render() {
    const { today, now } = this.state;
    const newDate = new Date(today.valueOf() + now * 24 * 60 * 60 * 1000);
    const year = newDate.getFullYear();
    const month = newDate.toLocaleString("en-US", { month: "long" });
    const day = newDate.getDate();

현재 today를 기준으로 now상태에 따라 날짜를 가져오도록 한다.
여기서 나는 월을 영문으로 가져오기 위해 이렇게 작업하였다.

newDate.toLocaleString("en-US", { month: "long" });

return (
        <img
          onClick={() => this.handleClickDate("left", -1)}
        />
        <i>
          <span>{month + " " + day + ", " + year}</span>
        </i>
        <img
          onClick={() => this.handleClickDate("right", 1)}
        />
    );