IndexedDB

IndexedDB初体验

特点:
  1. 对象形式存储
  2. 异步 (防止锁死浏览器,localstorage是同步的
  3. 支持事物 (只要有一步失败,整个事物回滚
  4. 同源限制 (不能跨域访问数据库
  5. 存储空间比localstorage大 (大的多
  6. 支持二进制存储
我写了一个 通讯录的项目,利用indexeddb在浏览器持续化端存储通讯录数据
学习自: 阮一峰浏览器数据库 & indexedDB API
我贴出大概示例:

图片描述

安装:
yarn install
运行:
yarn start

// DB.ts

interface Idb {
    database: string; // 数据库名称
    version: number; // 版本号
    db: any; // 数据库创建成功后的对象
    store: any[]; // 初始化存储数据
    tables: any[]; // 表选项
    
    open(): void; // 打开数据库方法
    add(): void; // 插入一条数据
    read(i): void; // 读取指定数据
    readAll(): void; // 读取全部数据
    remove(i): void; // 移除指定数据
    update(o): void; // 更新指定数据
}

init.ts


import IndexedDB from './DB';
var db_person = new IndexedDB('db_test', 1);
db_person.open(); // 初始化数据库操作
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值