如何使用 Ionic Infinite Scroll 使用 PouchDB 进行分页？

Question

假设我有 100 个文档（注意：文档总数肯定会增加）。一次获取所有 100 个文档会导致性能问题，所以我认为我需要进行无限滚动并显示，比如说，第一次加载 15 个文档。每次触发无限滚动，它应该再获得 15 个文档。

基本上，docArr.length = 100

第一次加载：将docArr[0] 抓取到docArr[14]

触发无限滚动：将docArr[15] 抓取到docArr[29] 以此类推，直到docArr[99] 也被抓取

在PouchDB FAQ on Pagination中注明需要使用startkey、endkey、limit和skip。

我的文档 ID 格式为 doc-1。所以我有doc-1、doc-2、doc-3等

我按照建议的方法使用，所以我的代码是；

var options = {limit : 15};
function fetchNextPage() {
  pouch.allDocs(options, function (err, response) {
    if (response && response.rows.length > 0) {
      let id_num = response[response.length - 1]._id.split('-').pop()
      //on first trigger, the line above should get '15'

      id_num = Number(id_num) + 1
      let id = 'doc-' + id_num 
      //on first trigger, id = 'doc-16'
      options.startkey = id;
      options.skip = 1;
    }
    // handle err or response
    
  });
}

但是，当我这样做时，当我触发无限滚动时，即使我增加了 id（我将其用作 @987654339 @)。

每次触发无限滚动（做分页）时如何获取接下来的 15 个文档？

Answer 1

我不是 100% 清楚 OP 的代码发生了什么，但假设对 _all_docs 的第一个查询的 response.rows 是这样排序的

rows index	id
0	doc-1
1	doc-2
2	doc-3
3	doc-4
4	doc-5
5	doc-6
6	doc-7
7	doc-8
8	doc-9
9	doc-10
10	doc-11
11	doc-12
12	doc-13
13	doc-14
14	doc-15

错误。文档 ID 是字符串，因此遵循 CouchDB 文档 3.2.2.5. Collation Specification 中记录的排序规则。

这应该是初始调用_all_docs根据OP指定的文档ID格式返回的文档ID的实际序列：

rows index	id
0	doc-1
1	doc-10
2	doc-100
3	doc-11
4	doc-12
5	doc-13
6	doc-14
7	doc-15
8	doc-16
9	doc-17
10	doc-18
11	doc-19
12	doc-2
13	doc-20
14	doc-21

因此下一组结果的计算存在缺陷

id_num = Number(id_num) + 1
let id = 'doc-' + id_num   
options.startkey = id;

计算下一个 id 是个坏主意，完全没有必要。而是使用 last document 的 id，例如

    let result = await db.allDocs(options);        
    if(result.rows.length) {
      // do something with results
      // get next page of docs?
      if(result.rows.length === options.limit) {        
        options.startkey = result.rows.pop().id;
        options.skip = 1;
        // repeat 
      }
    }

这个sn-p使用setTimeout每秒抓取15个文档，将文档id记录到控制台，当返回的文档数小于limit时退出，表示结果结束。

// canned test documents
function getDocsToInstall() {
  let docs = [];
  for (let i = 1; i < 101; i++) {
    docs.push({
      _id: `doc-${i}`
    });
  }
  return docs;
}

let db;

// init db instance
async function initDb() {
  db = new PouchDB('test', {
    adapter: 'memory'
  });
  await db.bulkDocs(getDocsToInstall());
}

function update(result) {
  console.log(result.rows.map(d => d.id).join(','));
}

initDb().then(async() => {
  let options = {
    limit: 15,
    include_docs: false,
    reduce: false
  };
  async function timerFn() {
    let result = await db.allDocs(options);
    if (result.rows.length) {
      update(result);
      // get next page of docs
      if (result.rows.length === options.limit) {
        options.startkey = result.rows.pop().id;
        options.skip = 1;
        // repeat
        setTimeout(timerFn, 1000);
      } else {
        console.log("All docs processed ?");
      }
    }
  };
  timerFn();
});

<script src="https://cdn.jsdelivr.net/npm/pouchdb@7.1.1/dist/pouchdb.min.js"></script>
<script src="https://github.com/pouchdb/pouchdb/releases/download/7.1.1/pouchdb.memory.min.js"></script>