add 遇主键冲突抛错，put 覆盖写入；新增用 add，更新或upsert用 put；get 查单条，getall 查多条（不传参查全部）；delete 必须在读写事务中执行；查不到数据需检查 keypath、索引和游标方向。
add 和 put 的区别到底在哪？什么时候该用哪个？
add 和 put 都往 object store 写数据，但行为关键差异在主键冲突处理：
-
add遇到重复主键（比如手动指定的id已存在）会直接抛错：DOMException: "Key already exists"` -
put则是覆盖写入，不管有没有旧数据，一律更新
常见误用场景：想“插入新记录”却用了 put，结果静默覆盖了已有数据；或者用 add 时没校验主键唯一性，导致事务中断。
使用建议：
- 明确要新增且不允许重复 → 用
add，配合onerror捕获冲突 - 更新或“有就改、没有就加” → 用
put - 主键是自增（
autoIncrement: true）时，add更安全，put也能用，但传null或不传主键字段才能触发自增
const request = objectStore.add({ id: 100, name: 'Alice' });
request.onerror = () => console.error('ID 100 已存在');
get() 查单条 vs getAll() 查多条：参数和返回值容易搞混
get() 只接受一个 key（或 key range），返回单个值（或 undefined）；getAll() 默认查全部，但常被误以为必须传参数——其实不传也合法，只是性能差。
关键细节：
-
get(5)→ 查主键为5的记录 -
getAll()→ 返回所有记录的数组（注意：不是 Promise，是 IDBRequest.result） -
getAll(IDBKeyRange.bound(1, 10))→ 查主键在 1–10 区间的所有记录 -
getAll(null, 20)→ 查前 20 条（第二个参数是 count）
性能提醒：
-
getAll()无参数时会把整个 store 加载进内存，大数据量下卡顿明显 - 要分页或条件查询，优先用
openCursor()+ 游标遍历，而不是靠getAll()后 filter
删除数据别只记得 delete()，还要注意事务生命周期
delete() 看似简单，但实际出问题多因事务已结束或 object store 打开方式不对。
anything-to-html
下载
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
典型错误：
- 在
transaction.oncomplete之后调用delete()→ 报错"Failed to execute 'delete' on 'IDBObjectStore': The transaction has finished." - 用只读事务（
"readonly"）执行delete()→ 报错"InvalidStateError: The transaction is not active."
正确姿势：
- 确保
delete()在读写事务中调用：transaction.objectStore('users').delete(123) - 不要等
oncomplete再操作，所有写操作必须在事务 active 期间发起 - 批量删用
openCursor()配合cursor.delete()，比循环调delete()更高效且事务友好
查不到数据？先检查 openCursor() 的游标方向和 keyPath
get() 和 getAll() 查不到，往往不是逻辑错，而是 schema 或索引没对上。
最常踩的坑：
- object store 创建时设了
keyPath: 'uid'，但存数据时没带uid字段 → 数据根本没进 store（静默失败） - 想按非主键字段查（比如
email），但没建索引 →getAll()只能全表扫，且无法用IDBKeyRange过滤 - 游标默认正向（
"next"），查prev方向时忘了设direction: "prev"，结果返回空
实操检查项：
- 用
objectStore.keyPath确认主键路径是否与数据结构一致 - 按非主键查前，确认索引存在：
objectStore.index('emailIndex') - 测试游标时加
cursor.onsuccess = () => { console.log(cursor.value); }，别只看result
IndexedDB 的增删改查本身不难，难的是每一步都依赖事务状态、schema 定义和异步时机——漏掉任何一个，就会返回 undefined 或报奇怪的 DOMException。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
