IndexedDB 游标分页与 KeyRange 查询实践

概述使用游标与范围查询可以对本地数据进行高效分页与筛选。本文给出标准实现与注意事项。范围与分页function openDB(name) { return new Promise((resolve, reject) => { const r = indexedDB.open(name, 1); r.onupgradeneeded = () => { const db = r.result; if (!db.objectStoreNames.contains('items')) db.createObjectStore('items', { keyPath: 'id' }); }; r.onsuccess = () => resolve(r.result); r.onerror = () => reject(r.error); }); } async function queryRange(offset = 0, limit = 20) { const db = await openDB('pagedb'); const tx = db.transaction('items', 'readonly'); const store = tx.objectStore('items'); const range = IDBKeyRange.lowerBound(offset); const req = store.openCursor(range); const out = []; await new Promise((resolve, reject) => { req.onsuccess = e => { const cursor = e.target.result; if (cursor && out.length < limit) { out.push(cursor.value); cursor.continue(); } else resolve(); }; req.onerror = () => reject(req.error); }); db.close(); return out; }