javascript - Firestore 分页向后总是转到第一条记录

Question

我正在制作一个简单的 Firestore 分页。当它前进时按预期工作，但当它应该倒退时，它总是转到第一条记录。

我已经在这里停留了一段时间，甚至将两者（向前和向后）都塞进了同一个函数中以简化调试。

编辑：

添加了简化版本（仍然是相同的不良结果）：

async init() {
  const result = await (await firestore())
    .collection('documents')
    .limit(this.limit)
    .orderBy('createTimestamp')
    // .orderBy('userName')
    .get()
  console.log(result)
  this.lastVisible = result.docs[result.docs.length - 1]
  ;[this.firstVisible] = result.docs
  result.forEach(doc => {
    console.log('doc', doc.data())
    this.myDocuments.push(doc)
  })
},
async forward() {
  const result = await (await firestore())
    .collection('documents')
    .orderBy('createTimestamp')
    // .orderBy('userName')
    .startAfter(this.lastVisible)
    .limit(this.limit)
    .get()
  this.lastVisible = result.docs[result.docs.length - 1]
  ;[this.firstVisible] = result.docs
  if (result.empty === false)
    result.forEach(doc => {
      console.log('doc', doc.data())
      this.myDocuments.push(doc)
    })
},
async backward() {
  const result = await (await firestore())
    .collection('documents')
    .orderBy('createTimestamp')
    // .orderBy('userName')
    .endBefore(this.lastVisible)
    .limit(this.limit)
    .get()
  this.lastVisible = result.docs[result.docs.length - 1]
  ;[this.firstVisible] = result.docs
  if (result.empty === false)
    result.forEach(doc => {
      console.log('doc', doc.data())
      this.myDocuments.push(doc)
    })
},

增加调用方法：

getAllDocuments: async ({ rootState, commit }, payload) => {
const documentsDb = new DocumentsDB(`${rootState.authentication.user.id}`)
console.log('Get all documents(admin)')
console.log('payload :>> ', payload)
const { startAt, endBefore, constraints, limit } = payload
console.log('startAt :>> ', startAt)
console.log('endBefore :>> ', endBefore)
console.log('limit :>> ', limit)
const documents = await documentsDb.readWithPagination(constraints, startAt, endBefore, limit)
console.log('documents', documents)
// const documents = await documentsDb.readAllAsAdmin()
// console.log('documents: ', documents)
commit('setDocuments', documents)  },

出于调试原因，我离开了 console.log()。

payload :>>  {constraints: null, endBefore: "2UxB7Z1HWCmvkEcfLZ5H", startAt: null, limit: 5}constraints: nullendBefore: "2UxB7Z1HWCmvkEcfLZ5H"limit: 5startAt: null__proto__: Object

原始代码

async readWithPagination(constraints = null, startAt = null, endBefore = null, limit = null) {
const collectionRef = (await firestore()).collection(this.collectionPath)
let query = collectionRef
if (limit) query = query.limit(limit)
query.orderBy('createTimestamp')
if (constraints) {
  constraints.forEach(constraint => {
    query = query.where(...constraint)
  })
}
query = query.orderBy(firebase.firestore.FieldPath.documentId())
if (startAt) {
  query = query.startAfter(startAt)
}
if (endBefore) {
  query = query.endBefore(endBefore)
  console.log('query :>> ', query)
}
const formatResult = result =>
  result.docs.map(ref =>
    this.convertObjectTimestampPropertiesToDate({
      id: ref.id,
      ...ref.data(),
    })
  )
return query.get().then(formatResult)  }

根据评论中的要求进行编辑：

    dispatchPaginatedForwardDocuments(startAt = null) {
  const payload = {}
  payload.orderBy = [['createTimestamp', 'asc']]
  payload.constraints = [['status', '==', 4]]
  payload.limit = this.limit
  payload.startAt = startAt?.id || null
  this.$store.dispatch('admin/getPaginatedForwardDocuments', payload, { root: true })
},
dispatchPaginatedPrevDocuments() {
  const payload = {}
  payload.orderBy = [['createTimestamp', 'asc']]
  payload.constraints = [['status', '==', 4]]
  payload.limit = this.limit
  payload.startAt = this.lastDocument.id
  payload.endBefore = this.firstDocument.id
  this.$store.dispatch('admin/getPaginatedBackwardsDocuments', payload, { root: true })
},

和这个：

import UserDocumentsDB from '@/firebase/user-documents-db'
// import UsersDB from '@/firebase/users-db'
import DocumentsDB from '@/firebase/documents-db'
import { storage } from 'firebase'

export default {



// Fetch documents with pagination forwards and constraints

  // This works as expected
  getPaginatedForwardDocuments: async ({ rootState, commit }, payload) => {
    const documentsDb = new DocumentsDB(`${rootState.authentication.user.id}`)
    const documents = await documentsDb.readPaginatedForward(payload)
    console.log('documents: ', documents)
    commit('setDocuments', documents)
  },

  
   // Fetch documents with pagination backwards and constraints
   
  getPaginatedBackwardsDocuments: async ({ rootState, commit }, payload) => {
    console.log('getPaginatedBackwardsDocuments', payload)
    const documentsDb = new DocumentsDB(`${rootState.authentication.user.id}`)
    const documents = await documentsDb.readPaginatedBackwards(payload)
    console.log('documents: ', documents)
    commit('setDocuments', documents)
  },

标签： javascriptfirebasegoogle-cloud-firestore