javascript - 将 SnapshotChanges 与 CombineLatest 结合使用

Question

我正在使用 combineLatest 合并来自 Firestore 的 3 个不同查询。但是，我不想使用 valueChanges()，我想使用 snapshotChanges()。

const newRef = this.afs.collection('applications', ref => ref.orderBy('date_created_at', 'desc').where('status', '==', 'new')).snapshotChanges().pipe(
  map(changes => {
    return changes.map(a => {
      const data = a.payload.doc.data() as Application;
      const id = a.payload.doc.id;
      return {id, ...data};
    })
  })
);

const pendingRef = this.afs.collection('applications', ref => ref.orderBy('date_created_at', 'desc').where('status', '==', 'pending')).snapshotChanges().pipe(
  map(changes => {
    return changes.map(a => {
      const data = a.payload.doc.data() as Application;
      const id = a.payload.doc.id;
      return {id, ...data};
    })
  })
);

const inprogressRef = this.afs.collection('applications', ref => ref.orderBy('date_created_at', 'desc').where('status', '==', 'in-progress')).snapshotChanges().pipe(
  map(changes => {
    return changes.map(a => {
      const data = a.payload.doc.data() as Application;
      const id = a.payload.doc.id;
      return {id, ...data};
    })
  })
);

const result = combineLatest<any[]>(newRef, pendingRef, inprogressRef).pipe(
  map(arr => arr.reduce((acc, cur) => acc.concat(cur)))
);
return result;

如何合并这 3 个查询以获取它们各自的文档 ID？我必须以这种方式编写 3 个查询还是有其他方式？我想简化代码。

Answer 1

有许多方法可以减少代码。

一个很简单的...

定义一个函数来完成这项工作:

function processChanges(changes) {
    return changes.map(a => {
      const data = a.payload.doc.data() as Application;
      const id = a.payload.doc.id;
      return {id, ...data};
    })
}

然后使用它3次:

const newRef = this.afs.collection('applications', ref => ref.orderBy('date_created_at', 'desc').where('status', '==', 'new')).snapshotChanges().pipe(map(processChanges)));

const pendingRef = this.afs.collection('applications', ref => ref.orderBy('date_created_at', 'desc').where('status', '==', 'pending')).snapshotChanges().pipe(map(processChanges)));

const inprogressRef = this.afs.collection('applications', ref => ref.orderBy('date_created_at', 'desc').where('status', '==', 'in-progress')).snapshotChanges().pipe(map(processChanges)));

const result = combineLatest<any[]>(newRef, pendingRef, inprogressRef).pipe(
  map(arr => arr.reduce((acc, cur) => acc.concat(cur)))
);
return result;

或者定义一个辅助函数并调用它三次:

函数 getApplicationsForStatus(状态){

return this.afs.collection('applications', ref => ref.orderBy('date_created_at', 'desc').where('status', '==', status)).snapshotChanges().pipe(
  map(changes => {
    return changes.map(a => {
      const data = a.payload.doc.data() as Application;
      const id = a.payload.doc.id;
      return {id, ...data};
    })
  })
);

并将其用作:

const newRef = getApplicationsForStatus('new');
const pendingRef = getApplicationsForStatus('pending'); 
const inprogressRef = getApplicationsForStatus('progress');

const result = combineLatest<any[]>(newRef, pendingRef, inprogressRef).pipe(
  map(arr => arr.reduce((acc, cur) => acc.concat(cur)))
);
return result;