I am wondering if there is a way to covert this function by using DayJS:
const formatHours = (dateStr: string) => {
const date = new Date(dateStr);
return `${date.getUTCHours()}:${date.getMinutes()}:${date.getSeconds()}`;
}
As per the DayJS documentation you can use dayjs().format()
Installation
You can follow this how to use/install DayJs in projects
Below is format supported
Format Output Description YY 18 Two-digit year YYYY 2018 Four-digit year M 1-12 The month, beginning at 1 MM 01-12 The month, 2-digits MMM Jan-Dec The abbreviated month name MMMM January-December The full month name D 1-31 The day of the month DD 01-31 The day of the month, 2-digits d 0-6 The day of the week, with Sunday as 0 dd Su-Sa The min name of the day of the week ddd Sun-Sat The short name of the day of the week dddd Sunday-Saturday The name of the day of the week H 0-23 The hour HH 00-23 The hour, 2-digits h 1-12 The hour, 12-hour clock hh 01-12 The hour, 12-hour clock, 2-digits m 0-59 The minute mm 00-59 The minute, 2-digits s 0-59 The second ss 00-59 The second, 2-digits SSS 000-999 The millisecond, 3-digits Z +05:00 The offset from UTC, ±HH:mm ZZ +0500 The offset from UTC, ±HHmm A AM PM a am pm
const date = new Date()
console.log(dayjs().format('HH:mm:ss'), '//24 hours time')
console.log(dayjs().format('h:m:s a'), '//12 hours time with AM/PM and signle digit')
console.log(dayjs().format('hh:mm:ss A'), '//12 hours time with AM/PM and double')<script src="https://unpkg.com/dayjs@1.8.21/dayjs.min.js"></script>Try this :
var dayjsShow = document.querySelector(".dayjs-show")
dayjsShow.innerHTML = dayjs().format('HH:mm:ss');<script src="https://cdnjs.cloudflare.com/ajax/libs/dayjs/1.7.8/dayjs.min.js"></script>
<div id="container">
<div class="item">
<span class="dayjs-show"></span>
</div>
</div>export const formatHours = (dateStr: string) => {
const date = new Date(dateStr);
return dayjs(date).format('H:m:s');
};