Блог

Я пишу приложение для чата со следующей моделью данных: используя следующий подход: store/index.js

  actions: {
bindMessages: firestoreAction(({ state, bindFirestoreRef }) => {
  // return the promise returned by `bindFirestoreRef`
  return bindFirestoreRef(
    'messages',
    db.collection('groupchats')
  );
}),
},
  

затем я получаю доступ к хранилищу сообщений.state из моих компонентов vue следующим образом:

 computed: {
Messages() {
  return this.$store.state.messages;
},
},
  

согласно документам vuexfire.
Я смог получить данные всей коллекции (реактивно), но мне нужен ** массив сообщений ** определенного документа, предполагая, что я знаю идентификатор документа. Как мне это сделать?

Следующее должно помочь:

 state: {
    // ...
    doc: null
},

mutations: vuexfireMutations,

getters: {
   // ...
},

actions: {
    bindDoc: firestoreAction(({ bindFirestoreRef }) => {
        return bindFirestoreRef('doc', db.collection('groupchats').doc('MI3...'))
    })
}
  

Вы можете сделать его динамическим следующим образом:

Компонент:

 // ...
<script>
export default {
  created() {
    this.$store.dispatch('bindDoc', { id: '........' }); // Pass the desired docId, e.g. MI3...
  },
};
</script>
// ...
  

Хранилище Vuex:

 state: {
    // ...
    doc: null
},

mutations: vuexfireMutations,

getters: {
  // ...
},
actions: {
    bindDoc: firestoreAction(({ bindFirestoreRef }, payload) => {
        return bindFirestoreRef('doc', db.collection('groupchats').doc(payload.id));
    }),
}