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

相关推荐
小杨累了3 分钟前
CSS Keyframes 实现 Vue 无缝无限轮播
前端
小扎仙森4 分钟前
html引导页
前端·html
万邦科技Lafite5 分钟前
API接口地址解析地区码操作指南
网络·数据库·redis·缓存·开放api·电商开放平台
此生只爱蛋9 分钟前
【Redis】常用命令
数据库·redis·缓存
小飞侠在吗28 分钟前
vue toRefs 与 toRef
前端·javascript·vue.js
csuzhucong31 分钟前
斜转魔方、斜转扭曲魔方
前端·c++·算法
Zsr102331 分钟前
MySQL 主从同步与读写分离:构建高性能、高可用数据库架构
数据库·mysql
老华带你飞34 分钟前
房屋租赁管理|基于springboot + vue房屋租赁管理系统(源码+数据库+文档)
java·数据库·vue.js·spring boot·后端·毕设
踢球的打工仔35 分钟前
mysql多表关联
数据库·mysql
IvorySQL44 分钟前
Postgres 18:Skip Scan - 摆脱最左索引限制
数据库·postgresql·开源