インターネットメモ帳

ウェブ制作と趣味のメモ帳

Day.jsを使って日付をフォーマット

Next.jsでDay.jsを使って日付フォーマットをしたので覚書き。

日付変換のコンポーネントを作成して、 「2022-07-26T11:34:00.000Z」を「2022/07/26」に変換。

import dayjs from 'dayjs';

// 日付のフォーマット
export default function ConvertData({ convertDate }) {
  const publishedAt = dayjs(convertDate).format('YYYY/MM/DD');
  return (
    <time dateTime={convertDate}>
      {publishedAt}
    </time>
  );
}

記事詳細(e.g [id].jsなど)など使いたいところでコンポーネントで日付(publishedAt)を渡す

…
<ConvertData convertDate={publishedAt}></ConvertData>
…

ビスコムさんのNext.jsの本で使われていたdate-fnsも気になる。 こちらは、tsが使われているようでモダンなライブラリ?なのかもしれない。