假設我有100 個檔案（注意：檔案總數肯定會增加）。一次獲取所有 100 個檔案會導致性能問題，所以我認為我需要進行無限滾動并顯示，比如說，第一次加載 15 個檔案。每次觸發無限滾動，它應該再獲得 15 個檔案。
基本上， docArr.length = 100
第一次加載：抓取docArr[0]到docArr[14]
觸發無限滾動：抓取docArr[15]到docArr[29]等等，直到docArr[99]也被抓取
在PouchDB 的 Pagination 常見問題解答中，宣告需要使用startkey、和。endkeylimitskip
我的檔案 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 （我用作 ），我也只能重復獲得前 15 個檔案（從element 0to ）。element 14startkey
每次觸發無限滾動（進行分頁）時，如何獲取接下來的 15 個檔案？
uj5u.com熱心網友回復：
我不是 100% 清楚 OP 的代碼發生了什么，但假設response.rows第一個查詢_all_docs的順序是這樣的
| 行索引 | ID |
|---|---|
| 0 | 檔案-1 |
| 1 | doc-2 |
| 2 | 檔案-3 |
| 3 | doc-4 |
| 4 | doc-5 |
| 5 | 檔案-6 |
| 6 | 檔案 7 |
| 7 | doc-8 |
| 8 | doc-9 |
| 9 | 檔案 10 |
| 10 | doc-11 |
| 11 | doc-12 |
| 12 | 檔案 13 |
| 13 | doc-14 |
| 14 | doc-15 |
錯了。檔案 ID 是字串，因此遵循 CouchDB 檔案3.2.2.5 中記錄的排序規則。整理規范。
根據 OP 指定的檔案 ID 的格式，這應該是初始呼叫回傳的檔案 ID 的實際序列：_all_docs
| 行索引 | ID |
|---|---|
| 0 | 檔案-1 |
| 1 | 檔案 10 |
| 2 | doc-100 |
| 3 | doc-11 |
| 4 | doc-12 |
| 5 | 檔案 13 |
| 6 | doc-14 |
| 7 | doc-15 |
| 8 | doc-16 |
| 9 | 檔案 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 是一個壞主意，完全沒有必要。而是使用最后一個檔案的 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
}
}
此代碼段用于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/[email protected]/dist/pouchdb.min.js"></script>
<script src="https://github.com/pouchdb/pouchdb/releases/download/7.1.1/pouchdb.memory.min.js"></script>轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/417557.html
標籤：