Tiện ích Ngày
Gói headless xuất một bộ các hàm trợ giúp Date gốc. Chúng thay thế nhu cầu về các thư viện như dayjs hoặc date-fns — thư viện không có phụ thuộc ngày tháng bên ngoài.
Tất cả các hàm đều là hàm thuần túy (chúng trả về đối tượng Date mới thay vì thay đổi đầu vào).
Nhập
import { today, parseDate, startOf, endOf, add, subtract, isSame, isBefore, isAfter, diff, daysInMonth, setYear, setMonth, setDate, setHour, setMinute, setSecond, formatBasic,} from "react-date-range-picker-headless";Loại DateUnit
Hầu hết các hàm chấp nhận một tham số DateUnit:
type DateUnit = "year" | "month" | "week" | "day" | "hour" | "minute" | "second" | "millisecond";Các hàm
today
Trả về ngày/giờ hiện tại.
const now = today(); // new Date()parseDate
Phân tích cú pháp một giá trị thành một đối tượng Date. Trả về new Date() nếu đầu vào là falsy.
parseDate("2026-03-01"); // DateparseDate(1709251200000); // Ngày từ dấu thời gianparseDate(existingDate); // Nhân bảnparseDate(null); // new Date() (phương án dự phòng)Chữ ký: parseDate(date?: Date | string | number | null): Date
startOf
Lấy thời điểm bắt đầu của một đơn vị thời gian.
startOf(date, "day"); // 2026-03-01 00:00:00.000startOf(date, "month"); // 2026-03-01 00:00:00.000startOf(date, "year"); // 2026-01-01 00:00:00.000startOf(date, "week"); // Bắt đầu tuần (mặc định Chủ nhật)startOf(date, "week", 1); // Bắt đầu tuần (Thứ hai)Chữ ký: startOf(date: Date, unit: DateUnit, weekStartsOn?: number): Date
endOf
Lấy thời điểm kết thúc của một đơn vị thời gian.
endOf(date, "day"); // 2026-03-01 23:59:59.999endOf(date, "month"); // 2026-03-31 23:59:59.999endOf(date, "year"); // 2026-12-31 23:59:59.999Chữ ký: endOf(date: Date, unit: DateUnit, weekStartsOn?: number): Date
add
Thêm một khoảng thời gian vào một ngày.
add(date, 1, "day"); // Ngày maiadd(date, 3, "month"); // 3 tháng sauadd(date, -1, "year"); // 1 năm trướcadd(date, 2, "hour"); // 2 giờ sauXử lý tràn tháng (ví dụ: 31 tháng 1 + 1 tháng = 28 tháng 2, không phải 3 tháng 3).
Chữ ký: add(date: Date, amount: number, unit: DateUnit): Date
subtract
Trừ một khoảng thời gian khỏi một ngày. Tương đương với add(date, -amount, unit).
subtract(date, 7, "day"); // 7 ngày trướcsubtract(date, 1, "month"); // 1 tháng trướcChữ ký: subtract(date: Date, amount: number, unit: DateUnit): Date
isSame
Kiểm tra xem hai ngày có giống nhau ở một đơn vị độ chính xác nhất định hay không.
isSame(date1, date2, "day"); // Cùng ngày trong lịch?isSame(date1, date2, "month"); // Cùng tháng?isSame(date1, date2, "year"); // Cùng năm?isSame(null, date2, "day"); // false (an toàn với null)Chữ ký: isSame(date1: Date | null | undefined, date2: Date | null | undefined, unit?: DateUnit): boolean
isBefore
Kiểm tra xem ngày đầu tiên có trước ngày thứ hai ở một độ chính xác nhất định hay không.
isBefore(date1, date2, "day"); // date1 có phải là một ngày sớm hơn không?isBefore(date1, date2); // So sánh mili giâyChữ ký: isBefore(date1: Date, date2: Date, unit?: DateUnit): boolean
isAfter
Kiểm tra xem ngày đầu tiên có sau ngày thứ hai ở một độ chính xác nhất định hay không.
isAfter(date1, date2, "day"); // date1 có phải là một ngày muộn hơn không?Chữ ký: isAfter(date1: Date, date2: Date, unit?: DateUnit): boolean
diff
Lấy chênh lệch giữa hai ngày trong một đơn vị nhất định.
diff(date1, date2, "day"); // Số ngày giữadiff(date1, date2, "month"); // Số tháng giữadiff(date1, date2, "year"); // Số năm giữaChữ ký: diff(date1: Date, date2: Date, unit: DateUnit): number
daysInMonth
Lấy số ngày trong tháng của một ngày.
daysInMonth(new Date(2026, 1)); // 28 (Tháng 2 năm 2026)daysInMonth(new Date(2026, 0)); // 31 (Tháng 1 năm 2026)Chữ ký: daysInMonth(date: Date): number
setYear / setMonth / setDate / setHour / setMinute / setSecond
Đặt một phần cụ thể của ngày, trả về một Date mới.
setYear(date, 2027); // Đổi năm thành 2027setMonth(date, 5); // Đổi thành tháng Sáu (chỉ số từ 0)setDate(date, 15); // Đổi thành ngày 15setHour(date, 14); // Đổi thành 2 giờ chiềusetMinute(date, 30); // Đổi thành :30setSecond(date, 0); // Đổi thành :00setYear và setMonth xử lý tràn (ví dụ: ngày 29 tháng 2 trong năm nhuận, đặt thành năm không nhuận, sẽ kẹp về ngày 28 tháng 2).
Các chữ ký:
setYear(date: Date, year: number): DatesetMonth(date: Date, month: number): DatesetDate(date: Date, day: number): DatesetHour(date: Date, hour: number): DatesetMinute(date: Date, minute: number): DatesetSecond(date: Date, second: number): Date
formatBasic
Định dạng ngày bằng một chuỗi mẫu.
formatBasic(date, "YYYY-MM-DD"); // "2026-03-01"formatBasic(date, "YYYY/MM/DD HH:mm:ss"); // "2026/03/01 14:30:00"formatBasic(date, "M/D"); // "3/1"formatBasic(date, "hh:mm A"); // Lưu ý: token A không được hỗ trợ, hãy sử dụng period từ hookCác token được hỗ trợ:
| Token | Đầu ra | Ví dụ |
|---|---|---|
YYYY | Năm 4 chữ số | 2026 |
MM | Tháng 2 chữ số | 03 |
M | Tháng (không có đệm) | 3 |
DD | Ngày 2 chữ số | 01 |
D | Ngày (không có đệm) | 1 |
HH | Giờ 2 chữ số (24h) | 14 |
H | Giờ (24h, không có đệm) | 14 |
hh | Giờ 2 chữ số (12h) | 02 |
h | Giờ (12h, không có đệm) | 2 |
mm | Phút 2 chữ số | 30 |
m | Phút (không có đệm) | 30 |
ss | Giây 2 chữ số | 05 |
s | Giây (không có đệm) | 5 |
Chữ ký: formatBasic(date: Date, format: string): string