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 方法

相关推荐
dorisrv1 分钟前
高性能的懒加载与无限滚动实现
前端
天生励志1234 分钟前
Redis 安装部署
数据库·redis·缓存
北半球的夜4 分钟前
emoji 表情符号保存问题
数据库·oracle
韭菜炒大葱7 分钟前
别等了!用 Vue 3 让 AI 边想边说,字字蹦到你脸上
前端·vue.js·aigc
StarkCoder19 分钟前
求求你,别在 Swift 协程开头写 guard let self = self 了!
前端
清妍_19 分钟前
一文详解 Taro / 小程序 IntersectionObserver 参数
前端
电商API大数据接口开发Cris26 分钟前
构建异步任务队列:高效批量化获取淘宝关键词搜索结果的实践
前端·数据挖掘·api
符方昊26 分钟前
如何实现一个MCP服务器
前端
喝咖啡的女孩27 分钟前
React useState 解读
前端
清风66666634 分钟前
基于单片机的智能家居多参数环境监测与联动报警系统设计
数据库·单片机·毕业设计·智能家居·课程设计·期末大作业