ReactでFirestoreのタイムスタンプを表示したい

Question

いつもお世話になっております。

Firestoreに保存しているタイムスタンプを表示したいと考えています。

まず、Firestoreに保存する際には下記のようにして登録しています。

databasesRef.doc(id).update({
  created_at: firebase.firestore.FieldValue.serverTimestamp()
});

特定のビューで表示する際に{item.created_at}のようにしているのですが、エラーが発生してしまいます。

Error: Objects are not valid as a React child (found: object with keys {seconds, nanoseconds}). 
If you meant to render a collection of children, use an array instead.

ちなみに、created_atはしっかり取得できていて、下記のようにコンソール上で確認できています。

created_at: Timestamp
       seconds: xxxxxxxx
       nanoseconds: xxxxxxxxxxx

Firestoreのドキュメントを参考にして{item.created_at.toDate()}も試してみたのですが、今度は別のエラーが発生してしまいました。

Cannot read property 'toDate' of undefined

どのようにすれば表示できるのでしょうか。
すみませんが、お知恵を拝借させていただければと思います。

Answer 1

もしかするとFirestore内ではMap型で保存されているかもしれません。
firebase.firestore.Timestamp.now()を使ってできるかお試しください。
あるいはnew Date()でもFirestore側でTimestamp型に変換されるはずです。

databasesRef.doc(id).update({
  created_at: firebase.firestore.Timestamp.now()
});

https://firebase.google.com/docs/reference/js/firebase.firestore.Timestamp#static-now

Comments

[k10a]

ご回答いただきありがとうございます。
まさにMap型で保存されているのが原因でした。