Mobile/react-native
[react-native] date-fns
춘햄
2024. 1. 26. 11:15
react-native에서 date-fns 라이브러리는 리액트에서 날짜 및 시간을 매우 쉽고 편리하게 다룰 수 있게 해주는 라이브러리이다.
이 라이브러리는 다양한 날짜 관련 기능을 제공하며, 사용하기 쉽고 가벼운 구조를 가지고 있다.
자세한 사용법은 여기에서 확인하자.
설치는 아래와 같이 설치한다.
npm install date-fns --save
# or
yarn add date-fns
바로 한번 예제 코드를 알아보자.
1.현재 날짜와 시간 표시
import { format } from 'date-fns';
const currentDate = format(new Date(), 'yyyy-MM-dd HH:mm:ss');
console.log('현재 날짜와 시간:', currentDate);
이 코드는 date-fns의 format 함수를 사용하여 현재 날짜와 시간을 'yyyy-MM-dd HH:mm:ss' 형식으로 표시한다.
new Date()를 통해 현재 날짜와 시간을 가져오고, format 함수로 원하는 형식으로 변환한다.
2: 특정 날짜로부터 일주일 후의 날짜 계산
import { addDays } from 'date-fns';
const today = new Date();
const nextWeek = addDays(today, 7);
console.log('오늘로부터 일주일 후:', format(nextWeek, 'yyyy-MM-dd'));
이 코드는 date-fns의 addDays 함수를 사용하여 오늘 날짜로부터 7일 후의 날짜를 계산한다.
new Date()로 오늘 날짜를 얻고, addDays 함수에 오늘 날짜와 추가하고자 하는 일 수(7일)를 전달한다.
그 후 format 함수를 사용하여 날짜를 원하는 형식으로 출력한다.
3. 두 날짜 간의 차이 계산
import { differenceInDays } from 'date-fns';
const startDate = new Date(2024, 0, 1); // 2024년 1월 1일
const endDate = new Date(2024, 0, 15); // 2024년 1월 15일
const diffDays = differenceInDays(endDate, startDate);
console.log('두 날짜의 차이(일):', diffDays);
이 코드는 date-fns의 differenceInDays 함수를 사용하여 두 날짜 사이의 일수 차이를 계산한다.
두 날짜는 new Date(year, month, day) 형식으로 생성되며, differenceInDays 함수에 두 날짜를 인수로 전달한다. 함수는 두 날짜 사이의 일수 차이를 반환한다.
이처럼 date-fns 라이브러리는 다양한 날짜 관련 연산을 쉽게 처리할 수 있게 해준다.
끝!
반응형