반응형
서론
화면 개발하다보며 date를 ui에 맞춰서 노출하거나 데이터를 기본 setting 할일이 자주 있다. 자주 사용하는 부분을 정리하고자 한다.
소스
<template>
</template>
<script>
export default {
methods: {
// Mon Mar 25 2024 13:20:32 GMT+0900 (한국 표준시)
getToDate() {
return new Date();
},
// 2024/03/25
getToday() {
const toDate = new Date();
return this.dateFormatter(toDate, '/');
},
// YYYYMMDD format. add : '-', '/', '.' 등등으로 표기 format
dateFormatter(data, add) {
if(!this.isDate(data)) return;
const year = data.getFullYear();
const month = this.leftPad(data.getMonth() +1);
const day = this.leftPad(data.getDate());
return [year, month, day].join(add ? add : '');
},
isDate(data){
const date = data instanceof Date ? data : new Date(data);
return !isNaN(date);
},
// 숫자가 1자리일때 0 붙여주기(날짜 표기를 위한)
leftPad(value) {
return value >= 10 ? value : `0${value}`;
}
}
}
</script>
결론
자주 사용하지만 매번 프로젝트 갈때마다 검색하는것보단 정리하여 바로바로 사용하도록 하자.
반응형
'개발 > Javascript' 카테고리의 다른 글
[Javascript] api get 호출 시 object 데이터 변환 URLSearchParams (0) | 2024.04.22 |
---|---|
[javascript] axios get통신 시 params 붙여서 set 하기 (0) | 2023.11.07 |
[JAVASCRIPT] recude 반복 중지 break 하기 (0) | 2023.07.10 |
[javascript] push() vs .push().apply() vs concat() (0) | 2023.02.27 |
[javascript] 기준 object 변경 없이 조회한 object 데이터만 set 하기 (0) | 2023.02.24 |