//第一步打开IndexedDB 参数1:表的名字 参数2:版本号
var request = window.indexedDB.open('userInfo', '1')
var db;
//打开数据库连接
request.onsuccess = function(event) {
db = request.result;
console.log('数据库打开成功');
};
//这个钩子只在表的版本发生改变时触发**
request.onupgradeneeded = function(event) {
db = event.target.result;
//创建表=>person keyPath为主键,当你不想使用自定义主键时添加{ autoIncrement: true }
var objectStore = db.createObjectStore('person', { keyPath: 'id' });
//unique是否可以重复**unique=true为不可以重复
objectStore.createIndex('name', 'name', { unique: false });
objectStore.createIndex('email', 'email', { unique: true });
}
//读取表内所有值
// params : 数据库名称,表名
export function readAll(dbName, tableName) {
// 请求打开数据库
let request = indexedDB.open(dbName);
// 请求成功的回调函数
request.onsuccess = function (e) {
// db = e.target.result // 获取实例
// transaction = db.transaction(tableName,'readwrite'); // 权限控制
// objectStore = transaction.objectStore(tableName); // 进行操作对象
let objectStore = e.target.result.transaction(tableName, 'readwrite').objectStore(tableName);
// 打开游标
let cursor = objectStore.openCursor();
// 储存值
let arr = [];
// 成功打开游标的回调函数
cursor.onsuccess = function (e) {
let result = e.target.result;
if (result) {
// 将数据一条一条保存到arr中
arr.push(result.value);
result.continue();
} else {
if (!arr) {
console.log('没有数据....');
} else {
console.log('[' + tableName + ']表中的数据为:' + JSON.stringify(arr));
}
}
}
}
}
// 删除数据库
export function deleteDB(dbName) {
try {
// 删除数据库使用 indexedDB对象的deleteDatabase方法
let request = indexedDB.deleteDatabase(dbName);
request.onerror = function () {
console.log('删除[' + dbName + ']数据库失败!!!!');
}
request.onsuccess = function () {
console.log('删除[' + dbName + ']数据库成功!!!!');
}
} catch (e) {
console.log('删除[' + dbName + ']数据库出现错误,' + e.getMessage);
}
}
// 关闭数据库
export function colseDB(dbName) {
dbName.close();
}
// 新增数据
// 数据库名称,对象仓库(表名),传入的参数
export function insert(dbName, objectStoreName, argument) {
// 打开数据库
let request = indexedDB.open(dbName);
// 请求数据库成功的回调函数
request.onsuccess = function (success) {
// 获取数据库实例对象
let db = success.target.result;
// 对某个表 进行事务操作的事务权限控制
let transaction = db.transaction(objectStoreName, 'readwrite');
// 对表进行操作
let objectStore = transaction.objectStore(objectStoreName)
// 使用add方法,此方法是异步的
// 有success,error事件
//objectStore.add(argument);
// 使用定义add方法
let add = objectStore.add(argument);
let msg = JSON.stringify(argument);
// 添加成功的回调函数
add.onsuccess = function (e) {
console.log(e);
console.log('向表[' + objectStoreName + ']新增一条数据为[' + msg + ']成功!!');
}
add.error = function (e) {
console.log('向表[' + objectStoreName + ']新增一条数据为[' + msg + ']失败!!');
}
}
}
// 查询数据
// 数据库名,对象仓库(表名),查询参数(键名对应的值)
export function getData(dbName, objectStoreName, selectArgument) {
// 打开数据库
let request = indexedDB.open(dbName);
// 请求打开数据库的回调函数
request.onsuccess = function (success) {
let db = success.target.result;
let transaction = db.transaction([objectStoreName], 'readwrite');
let objectStore = transaction.objectStore(objectStoreName);
let getResult = objectStore.get(selectArgument);
getResult.onsuccess = function (e) {
console.log(e.target.result);
}
}
}
// 更新数据
// 数据库名,表名,要更新数据的标志(id),新的数据
export function update(dbName, objectStoreName, id, newsData) {
// 打开数据库
let request = indexedDB.open(dbName);
// 请求打开数据库的回调函数
request.onsuccess = function (success) {
// 获取到数据库的表
let db = success.target.result;
// 对表操作进行事务权限控制
let transaction = db.transaction(objectStoreName, 'readwrite');
// 对表进行操作
let objectStore = transaction.objectStore(objectStoreName);
// 根据键值 获取某个实例中的某条数据
let getResult = objectStore.get(id);
// 实例成功的回调函数
getResult.onsuccess = function (e) {
// 重新赋值
objectStore.put(newsData, id);
}
// 实例失败的回调函数
getResult.onerror = function (e) {
console.log('数据更新失败!!');
}
}
}
//删除数据
export function delMessage(dbName, objectStoreName, id) {
// 打开数据库
let request = indexedDB.open(dbName);
request.onsuccess = function (success) {
// 获取到数据库的表
let db = success.target.result;
// 对表操作进行事务权限控制
let transaction = db.transaction(objectStoreName, 'readwrite');
// 对表进行操作
let objectStore = transaction.objectStore(objectStoreName);
let delFinal=objectStore.delete(id)
delFinal.onsuccess = function () {
console.log('delete complete');
}
}
}
IndexedDB 使用
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
推荐阅读更多精彩内容
- WebSql 没等我用就早早的被废弃了,Cookie似乎又是后端的专属... 先看看localStorage 和 ...