Как использовать Момент. js с Vuexfire - PullRequest
Новая
       121

Как использовать Момент. js с Vuexfire

1 голос
/ 25 января 2020

Я создаю приложение Vue. js, которое использует Vuexfire в файле магазина. js. Мое приложение позволяет пользователю помещать в Firestore сообщения, введенные пользователем, с отметками времени. Я настраиваю свой обработчик действий Vuexfire для фиксации мутации полезной нагрузки firebase, упорядоченной по метке времени, например: 

import Vue from "vue";
import Vuex from "vuex";
import firebase from "firebase";
import { vuexfireMutations, firestoreAction } from 'vuexfire'
import { db } from "@/main";
import moment from 'moment'

Vue.use(Vuex);

export default new Vuex.Store({
  state: {
    posts: []
  },
  mutations: {
    ...vuexfireMutations
  },
  actions: {
    setAllPost: firestoreAction(context => {
      return context.bindFirestoreRef('posts', db.collection('posts').orderBy('timestamp'))
    })
  }
});

Эта установка правильно упорядочивает посты в порядке метки времени. ОДНАКО, я буду sh форматировать метки времени с помощью Moment. js, но не уверен, как правильно применить Moment к обработчику действий. Я попытался обернуть метку времени в Момент, например, так: 

  actions: {
    setAllPost: firestoreAction(context => {
      return context.bindFirestoreRef('posts', 
      db.collection('posts').orderBy(moment('timestamp').format('lll')))
    })
  }

... но это не вернуло ничего, только предупреждение в консоли. Я также попытался настроить компонент ввода так, чтобы временная метка, помещенная в Firebase, уже форматировалась с помощью Moment, но сообщения не возвращались в правильном порядке. Есть идеи, как правильно настроить Moment. js в обработчике действий Vuexfire для форматирования метки времени? Спасибо!

Ответы [ 2 ]

0 голосов
/ 25 января 2020

Вы не можете применить такой порядок в пожарном депо. orderBy() принимает строку, которая является именем свойства, которое вы хотите использовать в качестве базы заказа, или путь к нему (тип TS fieldPath: string | firestore.FieldPath).

https://firebase.google.com/docs/firestore/query-data/order-limit-data

Чтобы форматировать даты, вы должны сделать это на стороне клиента, как вы делаете, или сохранить даты в формате, который вы sh, а затем упорядочить по ним.

0 голосов
/ 25 января 2020

Я нашел решение, используя свойство filters: 

<p>{{ post.timestamp | moment }}</p>


filters: {
  moment: function (date) {
    return moment(date).format('lll')
  }
},

Это работает нормально. Я все еще хотел бы знать, есть ли способ использовать Moment. js внутри обработчика действий Vuexfire. Это возможно?

...