indexDB vue 创建数据库 创建表 添加对象数据

1 .open(dbName,1) 版本号可以省略

javascript 复制代码
 let dbName = 'hist-data-1d'
      const request = indexedDB.open(dbName); // 如果你不知道数据库的版本号,可以省略第二个参数,这样 indexedDB 会默认为你打开最新版本的数据库,因为版本号总是自增长的

2 第一次创建表 或数据库版本变化时创建表

javascript 复制代码
// 数据库版本变化时创建表
      request.onupgradeneeded = event => {
        for (let symbol of symbolList) { //  for (let symbol in symbolList) 循环打印出来的是 symbolList 中每个元素的索引
          symbol = symbol.replace('-', '_').toLowerCase();

          const db = event.target.result;
          db.createObjectStore(symbol);
        }
      };

3 指定表 添加数据 key value

javascript 复制代码
 request.onsuccess = event => {

    const db = event.target.result;
    const transaction = db.transaction([tablie], 'readwrite');
    const objectStore = transaction.objectStore(tablie);
    
    let key = 'key'
    const request = objectStore.add(data, key);
}

4 add 是累加数据 put 是只有一条数据

javascript 复制代码
const request = objectStore.add(data, key);

ps

ps1. 如果使用 add 方法添加的数据中 key 已经存在于对象仓库中,则会抛出 ConstraintError 错误

ps2 .需要更新已经存在的数据,你应该使用 put 方法而不是 add 方法

相关推荐
陈天伟教授几秒前
TraeWork初体验-生成研究报告
大数据·数据库·人工智能
大黄说说5 分钟前
SQL Server 执行计划怎么看?快速定位 SQL 慢的根源
java·linux·数据库
默_笙7 分钟前
🚩 React + TypeScript 的 Props 通信,我从"把事件对象传给父组件"进化到了"只传值"
前端·javascript
渣波10 分钟前
赋予 React “多线程”:Hooks + Web Worker 并发计算架构深度解析
前端·javascript
光影少年12 分钟前
Codex 斜杠指令体系与业务场景调度实战
前端·react.js·reactivex
90后的晨仔12 分钟前
uni-app中如何跳转?
前端
专注API从业者24 分钟前
告别人工盯品!Open Claw 搭建京东商品全自动监控与数据分析系统(附完整可运行代码)
大数据·数据库·数据分析
Y3815326621 小时前
SERP API 请求体 Gzip 压缩优化实战:大数据量降带宽 80%
开发语言·前端·php
踩着两条虫2 小时前
VTJ.PRO AI Agent 技术白皮书
前端·vue.js·低代码
子兮曰2 小时前
解剖 Claude Code:从入口架构逆向工程看 AI 编程工具的信任边界设计
前端·后端·claude