タイトル通り、JavaScript で日付データを「○日前」や「○時間前」などの表記で表示する方法についてです。
調べたところ、「moment-timezone」というライブラリを使えば簡単に実装できるとのことだったので、その手順をまとめます。
参考にさせていただいた記事はこちらから。
JSでの何分前、何日前の表示は moment.js におまかせ [BitScheduler開発日誌] – Qiita
https://qiita.com/isatan@github/items/27df4df54d31f76c2683
まずライブラリを下記のコマンドでインストールします。
npm install moment moment-timezone --save
なお、既に moment.js
をインストールしている場合は、moment-timezone
のみのインストールでOKです。
上記が終わったら、実装したいファイルにまず下記の 2行をインポートします。
import moment from 'moment-timezone'; import 'moment/locale/ja';
あとは下記のように記述すればOKです!
const date = moment.tz([変換したい日付データ], 'Asia/Tokyo'); date.fromNow();
そうすれば、現在のデータと比較して、自動的に「○時間前」や「○日前」などが表示されます!
これ非常に便利です…!
プロジェクトに Twitter や Instagram など SNS のタイムラインのような機能があるので実装したかったのですが、本当にお手軽でした!
なお、import 'moment/locale/ja';
を追加しないと英語表記になったので、ご注意ください。
以上、JavaScript で「moment-timezone」を使って○日前の表示を実装する方法でした。
ご参考になれば幸いです。