firestore部分的访问方式——vuefire答案

【问题标题】：Access method in the firestore section - vuefirefirestore部分的访问方式——vuefire
【发布时间】：2021-05-04 09:12:07
【问题描述】：

我正在尝试访问 vuefire 的 firestore 部分中的方法，但出现此错误：

vue-router.esm.js?8c4f:2257 TypeError: Cannot read property 'messagesWith' of undefined
    at eval (Chat.vue?62f3:214)

这是发生错误的行：

parents: this.messagesWith(db.auth().currentUser.uid),

以下是我的完整代码：

export default {
  data: () => ({

    activeChat: undefined,
    parents: [],
    messages: [],
    messageForm: {
      content: "",
      me: true,
      createdAt: new Date()
    }
  }),
  firestore: {
    // eslint-disable-next-line no-undef
    messages: db.collection(message_collection_name).orderBy('createdAt','asc'),
    parents: this.messagesWith(db.auth().currentUser.uid),
  },
  computed: {
    
  },
  methods:{
    
    dmCollection(toUid){
      const idPair = [db.auth().currentUser.uid, toUid].join('_').sort();
      return db.firestore().collection(direct_message).doc(idPair).collection(message_collection_name);
    },
    sendDm(toUid, messageText){
      return this.dmCollection(toUid).add({
        from: db.auth().currentUser.uid,
        message: messageText,
        sent: db.firestore.FieldValue.serverTimestamp()
      })
    },
    messagesWith(uid){
      return this.dmCollection(uid).orderBy('sent', 'desc').get();
    },
    
  },
}

【问题讨论】：

标签： javascript vue.js vuefire

【解决方案1】：

为了访问本地选项/方法，将 firestore 定义为返回对象的函数：

  firestore:()=> ({
    // eslint-disable-next-line no-undef
    messages: db.collection(message_collection_name).orderBy('createdAt','asc'),
    parents: this.messagesWith(db.auth().currentUser.uid),
  }),

【讨论】：