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

相关推荐
用户55084929025622 分钟前
CSS布局实战:从Flex到Grid的完整避坑指南
前端
用户55084929025623 分钟前
前端接口请求层怎么封装?一个可落地的请求方案
前端
写后端的胖头鱼34 分钟前
【高频面试题】FullText 全文索引(MySQL)
数据库·mysql·索引·全文索引
MetWeave37 分钟前
跟着一条 SPECI 走流水线:从电报到界面
前端
用户91775337187544 分钟前
从零封装一个地图组件库:OpenLayers + Vue 的工程化实践
vue.js
路远的数据库笔记1 小时前
SQL Server迁移国产数据库怎么做?九套口岸库零停机割接实战
数据库·经验分享·sqlserver·dba
樱花落木兰1 小时前
分布式登录实战:Session 会话共享改造,Redis 存储用户登录状态
java·javascript·数据库·redis·分布式·缓存
Helix2501 小时前
Chrome 开发者工具进阶:长截图、网络调试与性能分析
前端·chrome·chrome devtools·使用技巧·性能分析·开发者工具·长截图
kaiyou20261 小时前
用户研究岗秋招,统计分析能力怎么学习和证明?
数据库·python·学习
liangshanbo12151 小时前
面试题:Webpack 的 publicPath 有什么作用?
前端·webpack·node.js