TS_영업 중 인지 시간 계산 하기

개인 프로젝트 진행하다가 가게 영업중일 때 영업중이라고 표시해주는
기능을 만들어봄.

사용할 라이브러리는 JS유우명 라이브러리 moment 이다.

npm install moment

ㄱㄱ

먼저 시간을 00:00 이런식으로 데이터 베이스 에서 받아오기 때문에 포멧을 정해줘야한다.

const format ='HH:mm'

그다음 moment와 현재 시간을 변수에 담아주자.

const now = moment();
const nowTime = moment(now,format);

이렇게하면 nowTime은 현재 시간을 00:00 형식으로 담고 있게 됨.

그럼 이제 영업시간도 이와같이 지정해주자.
영업시간 값은 데이터 베이스에서

"00:00-00:00" 이런 string 값으로 가져온다고 가정함.

//DB에서가져온값 = 09:00-18:00 이라고 가정할 때 
const beforeTime = moment(DB에서가져온값.substring(0,5),format); //앞 5자리(09:00)
const afterTime = moment(DB에서가져온값.substring(6,11),format); // - 제외한 뒤 5자리(18:00)

이제 준비는 끝났다.
만약 beforeTime이나 afterTime에서 가져온 값이 없다면 오류가 날 수 있다.
근데 종종 데이터가 없는 친구들이 있을 수 있으니 삼항연산자를 사용해서 그런 오류를
사전에 차단 해 줄 수 도 있다.

//DB에서 가져온 값 이름이 time 이라고 가정할 때.

const beforeTime = moment(time?time.substring(0,5):null,format);

암튼 이제 JSX ㄱㄱ

JSX

{
   nowTime.isBetween(beforeTime,afterTime)
   ?
      <span>영업중</span>
   :
      <span>영업중아님</span>
}

현재시간.isBetween(A,B)

은 현재시간값이 A,B사이에 있으면 true,아니면 false를 반환한다.
물론 시간만이 아니라 날짜로 지정할 수 도 있음.

좋은 웹페이지 즐겨찾기