Как отображать метки времени в приложении Vue .js / Firebase - PullRequest
Новая
       24

Как отображать метки времени в приложении Vue .js / Firebase

0 голосов
/ 12 февраля 2020

Я пытаюсь создать приложение для чата Vue .js / Firebase на основе следующего репо: https://github.com/jsfanatik/vuestacks-chat-vue-firebase. Я настроил компонент Chat, чтобы разрешить загрузку введенных сообщений в хранилище, а затем вернуть сообщения в шаблон с помощью метода getMessage(). Метод getMessage() возвращает все содержимое сообщения на экран, включая имя вошедшего в систему пользователя, содержимое сообщения и метку времени, переформатированную с моментом. js. Проблема с репо заключается в том, что как только новое сообщение добавляется, временные метки всех остальных сообщений будут повторно отображаться, чтобы отразить временную метку самого последнего сообщения. Я думал, что проблема будет l ie в методе getMessage(): 

    async getMessage () {
      let snapshot = await db.collection('messages').orderBy('timestamp').get()
      const messages = []
      snapshot.forEach(doc => {
        let appData = doc.data()
        appData.id = doc.id
        appData.timestamp = moment(doc.timestamp).format('lll')
        messages.push(appData)
      })
      this.messages = messages
    },

... но я не уверен, как перенастроить этот метод для решения этой проблемы. Есть идеи, как заставить каждое сообщение сохранять собственную метку времени, а не текущее сообщение? Спасибо!

Ответы [ 2 ]

0 голосов
/ 12 февраля 2020

Метка времени Firebase может отображаться как миллисекунды с той эпохи, которую можно использовать в конструкторе моментов 

moment(doc.timestamp.toMillis()).format('lll')
0 голосов
/ 12 февраля 2020

Я думаю, вам нужно преобразовать метку времени Firestore в Javascript Дата перед использованием с моментом js

appData.timestamp = moment(appData.timestamp.toDate()).format('lll')
...