Javascript 如何从VueFire查询中获取最后一个文档

因为我不是JS专家，所以解决这个问题很沮丧 从上的VueFire文档中，我假设bindFirestoreRef包装的$bind方法返回一个带有结果的承诺，并将其绑定到该方法。根据该文件：

因此，您应该能够执行相同的操作，然后使用以下内容从数组中获取文档：

bindFirestoreRef('leads', db.collection('leads').orderBy('updated.date', 'desc').limit(30)).then(documents => {
  this.lastDoc = documents[documents.length - 1];
})

---

从上的VueFire文档中，我假设bindFirestoreRef包装的$bind方法返回一个带有结果的承诺，并将其绑定到该方法。根据该文件：

因此，您应该能够执行相同的操作，然后使用以下内容从数组中获取文档：

bindFirestoreRef('leads', db.collection('leads').orderBy('updated.date', 'desc').limit(30)).then(documents => {
  this.lastDoc = documents[documents.length - 1];
})

---

假设我有一个客户记录的集合，我正在显示上次更新的前5个订单

问题是

getLeads: firestoreAction(({ commit, bindFirestoreRef
}) => {
    bindFirestoreRef('Leads', db.collection('leads')
   .orderBy('updated.date', 'desc').limit(5)).then(documents => {
        commit('POPULATE_TESTLEADS', documents);
        commit('LAST_DOC', documents[documents.length - 1]);
    });

}),

我将结果和lastdoc保存在状态中，循环并显示名称，如下所示：

Nakheel
Emaar Group
Yapi Kredi Inc
Cairo Amman Bank
Arab Jordan Investment Bank LLC

然后，我再次调用最后一个文档作为查询游标，并期望接下来的5个文档从firebase返回，如下所示

moreLeadLeads: firestoreAction(({ state, bindFirestoreRef
}) => {
    bindFirestoreRef('testLeads', db.collection('leads')
    .orderBy('updated.date', 'desc')
   .startAfter(state.lastDoc).limit(5))
}),

---

但是我从firestore得到了与上面相同的5个结果。我做错了什么

假设我有一组客户记录，我正在显示上次更新的前5个订单

问题是

getLeads: firestoreAction(({ commit, bindFirestoreRef
}) => {
    bindFirestoreRef('Leads', db.collection('leads')
   .orderBy('updated.date', 'desc').limit(5)).then(documents => {
        commit('POPULATE_TESTLEADS', documents);
        commit('LAST_DOC', documents[documents.length - 1]);
    });

}),

我将结果和lastdoc保存在状态中，循环并显示名称，如下所示：

Nakheel
Emaar Group
Yapi Kredi Inc
Cairo Amman Bank
Arab Jordan Investment Bank LLC

然后，我再次调用最后一个文档作为查询游标，并期望接下来的5个文档从firebase返回，如下所示

moreLeadLeads: firestoreAction(({ state, bindFirestoreRef
}) => {
    bindFirestoreRef('testLeads', db.collection('leads')
    .orderBy('updated.date', 'desc')
   .startAfter(state.lastDoc).limit(5))
}),

---

但是我从firestore得到了与上面相同的5个结果。我做错了什么

VueFire和VuexFire内部使用序列化程序函数，将RTDB或Firestore返回的每个文档映射到绑定到最终组件或Vuex存储状态的数据对象

默认序列化程序由vuefire核心库中的函数实现：

/** *@param{firebase.firestore.DocumentSnapshot}doc *@return{DocumentData} */ 导出函数createSnapshot doc{ //将所有内容默认为false，因此无需设置 返回Object.definePropertydoc.data“id”{ 值：doc.id } } 如您所见，它只返回添加了id的doc.data，并丢弃doc对象。但是，当通过query.startAfterdoc实现Firestore分页时，我们需要原始的doc对象。好消息是，VueFire和VuexFire API允许我们用自己的序列化程序替换序列化程序，这样可以保留doc对象：

const serialize=doc:firestore.DocumentSnapshot=>{ 常量数据=文档数据； Object.definePropertydata，'id'，{value:doc.id}； Object.definePropertydata，'.\u doc'，{value:doc}； 返回数据； } 我们可以通过全局或每个绑定通过配置新的VuexFire序列化程序

//全球定义 Vue.usefirestorePlugin，{serialize}

//或每装订 bindFirebaseRef'todos'，db.ref'todos'，{serialize}

对于VuexFire，我们现在可以以state.todos[0].\u doc或last document state.todos[state.todos.length-1].\u doc的形式访问第一个文档，并使用它们来实现集合分页查询，或者在基本查询具有多字段排序时，获取绑定单个文档的下一个和上一个查询

---

注意：由于_doc和id是不可枚举的属性，它们不会出现在中的组件或存储对象上。

VueFire和VuexFire内部使用序列化程序函数，将RTDB或Firestore返回的每个文档映射到绑定到最终组件或Vuex存储状态的数据对象中

默认序列化程序由vuefire核心库中的函数实现：

/** *@param{firebase.firestore.DocumentSnapshot}doc *@return{DocumentData} */ 导出函数createSnapshot doc{ //将所有内容默认为false，因此无需设置 返回Object.definePropertydoc.data“id”{ 值：doc.id } } 如您所见，它只返回添加了id的doc.data，并丢弃doc对象。但是，当通过query.startAfterdoc实现Firestore分页时，我们需要原始的doc对象。好消息是，VueFire和VuexFire API允许我们用自己的序列化程序替换序列化程序，这样可以保留doc对象：

const serialize=doc:firestore.DocumentSnapshot=>{ 常量数据=文档数据； Object.definePropertydata，'id'，{value:doc.id}； Object.definePropertydata，'.\u doc'，{value:doc}； 返回数据； } 我们可以通过全局或每个绑定通过配置新的VuexFire序列化程序

//全球定义 Vue.usefirestorePlugin，{serialize}

//或每装订 bindFirebaseRef'todos'，db.ref'todos'，{serialize}

对于VuexFire，我们现在可以以state.todos[0].\u doc或last document state.todos[state.todos.length-1].\u doc的形式访问第一个文档，并使用它们来实现集合分页查询，或者在基本查询具有多功能时，获取绑定单个文档的下一个和上一个查询 eld排序

---

注意：因为_doc和id是不可枚举的属性，所以它们不会出现在组件上或存储中的对象。

谢谢。但它似乎不起作用。实际上，将最后一个文档数据传递给firestore不能用作查询游标。我应该传递一个文档引用，它是$bind returns文档的父级：您可以向我展示使用文档引用初始化游标的方法的文档吗？在我经常使用的客户机中，ReactNative、Swift、Flatter是一个文档快照，因为它包含光标所需的实际数据。其分页下的查询部分document snapshot是游标所需的，但是，正如在我的原始问题中一样，VuexFire中$bind中的文档将重新发布文档的实际数据，而不是文档快照。您还可以传递一个值数组，而不是文档快照。谢谢。但它似乎不起作用。实际上，将最后一个文档数据传递给firestore不能用作查询游标。我应该传递一个文档引用，它是$bind returns文档的父级：您可以向我展示使用文档引用初始化游标的方法的文档吗？在我经常使用的客户机中，ReactNative、Swift、Flatter是一个文档快照，因为它包含光标所需的实际数据。其分页下的查询部分document snapshot是游标所需的，但是，正如在我的原始问题中一样，VuexFire中$bind中的文档将重新发布文档的实际数据，而不是文档快照。您还可以传递一个值数组，而不是文档快照。我也有同样的问题。这几乎让我达到了目的，但我仍然不清楚如何将分页查询结果绑定到原始状态数据。我以前无法添加评论，所以我在这里创建了一个新问题，我添加了一些可能的解决方案，用于扩展此功能以实现分页。我也有同样的问题。这几乎让我达到了目的，但我仍然不清楚如何将分页查询结果绑定到原始状态数据。我以前无法添加评论，所以我在这里创建了一个新问题，我添加了一些可能的解决方案，用于扩展此功能以实现分页。