1 Star 1 Fork 6

yinlingyun/pureVue3

Create your Gitee Account
Explore and code with more than 13.5 million developers,Free private repositories !:)
Sign up
文件
This repository doesn't specify license. Please pay attention to the specific project description and its upstream code dependency when using it.
Clone or Download
indexDB.tsx 7.16 KB
Copy Edit Raw Blame History
yinlingyun authored 2022-06-29 17:06 +08:00 . indexedDB汇总ts
/**
* 打开/创建数据库
* @param {object} dbName 数据库的名字
* @param {string} storeName 仓库名称
* @param {string} version 数据库的版本
* @param {string} keyPath 主键键值,不传就自动创建主键
* @param {Array} index 索引数组
* @return {object} 该函数会返回一个数据库实例
*/
type StoreOptions = {
autoIncrement: boolean;
keyPath?: string;
};
export const openDB = function (
dbName: string,
version: number,
storeName: string,
keyPath?: string,
index?: Array<any[]> | undefined
) {
return new Promise((resolve, reject) => {
// 兼容浏览器
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore
const { webkitIndexedDB, indexedDB, mozIndexedDB, msIndexedDB } = window;
const indexDB = indexedDB || mozIndexedDB || webkitIndexedDB || msIndexedDB;
let db = null;
const request = indexDB.open(dbName, version);
// 操作成功
request.onsuccess = function (event: any) {
db = event?.target?.result; // 数据库对象
resolve({ code: 0, success: true, data: db, msg: "数据库打开成功!" });
};
// 操作失败
request.onerror = function () {
resolve({ code: -1, success: false, data: null, msg: "数据库打开失败!" });
};
// 创建表和索引
request.onupgradeneeded = function (event: any) {
// 数据库创建或升级的时候会触发
db = event?.target?.result; // 数据库对象
const storeOptions: StoreOptions = {
autoIncrement: true,
};
if (keyPath && keyPath !== "") {
storeOptions.autoIncrement = false;
storeOptions.keyPath = keyPath;
}
// 创建表
if (!db.objectStoreNames.contains(storeName)) {
const store = db.createObjectStore(storeName, storeOptions);
// 创建索引
// indexName索引列名称
// indexKey索引键值
if (index && index.length > 0) {
index.forEach((item: any) => {
if (
!item.indexName ||
!item.indexKey ||
item.options.unique === undefined
) {
reject(
"索引格式错误,请参照格式{indexName:'indexName',indexKey:'indexKey',{unique: false}}"
);
}
store.createIndex(item.indexName, item.indexKey, item.options);
});
}
}
};
});
};
/**
* 新增数据
* @param {object} db 数据库实例
* @param {string} storeName 仓库名称
* @param {object} dataConfig 添加的数据集合
**/
export const addData = function (db: any, storeName: string, dataConfig: any) {
return new Promise((resolve, reject) => {
if (!db) {
reject("数据库不存在或没有初始化");
}
if (!dataConfig || !dataConfig.value) {
reject("value是必传项,参照格式{[keyPath]:'key',value:'value'}");
}
const req = db
.transaction([storeName], "readwrite")
.objectStore(storeName) // 仓库对象
.add(dataConfig);
// 操作成功
req.onsuccess = function () {
resolve({ code: 0, success: true, data: null, msg: "数据写入成功!" });
};
// 操作失败
req.onerror = function () {
const data = {
code: -1,
success: false,
data: null,
msg: "数据写入失败!",
};
resolve(data);
};
});
};
/**
* 更新数据
* @param {object} db 数据库实例
* @param {string} storeName 仓库名称
* @param {object} dataConfig 更新的数据集合
*/
export const updateData = function (
db: any,
storeName: string,
dataConfig: any
) {
return new Promise((resolve, reject) => {
if (!db) {
reject("数据库不存在或没有初始化");
}
if (!dataConfig || !dataConfig.value) {
reject("value是必传项,参照格式{[keyPath]:'key',value:'value'}");
}
const req = db
.transaction([storeName], "readwrite")
.objectStore(storeName)
.put(dataConfig);
// 操作成功
req.onsuccess = function () {
resolve({ code: 0, success: true, data: null, msg: "数据更新成功!" });
};
// 操作失败
req.onerror = function () {
const data = {
code: -1,
success: false,
data: null,
msg: "数据更新失败!",
};
resolve(data);
};
});
};
/**
* 查询数据
* @param {object} db 数据库实例
* @param {string} storeName 仓库名称
* @param {string} key 数据主键
**/
export const getData = function (db: any, storeName: string, key: string) {
return new Promise((resolve, reject) => {
if (!db) {
reject("数据库不存在或没有初始化");
}
const req = db
.transaction([storeName], "readonly")
.objectStore(storeName) // 仓库对象
.get(key);
// 操作成功
req.onsuccess = function (e: { target: { result: any } }) {
resolve({
code: 0,
success: true,
data: e?.target?.result,
msg: "数据获取成功!",
});
};
// 操作失败
req.onerror = function () {
const data = {
code: -1,
success: false,
data: null,
msg: "数据获取失败!",
};
resolve(data);
};
});
};
/**
* 删除数据
* @param {object} db 数据库实例
* @param {string} storeName 仓库名称
* @param {string} key 数据主键
**/
export const deleteData = function (db: any, storeName: string, key: string) {
return new Promise((resolve, reject) => {
if (!db) {
reject("数据库不存在或没有初始化");
}
const req = db
.transaction([storeName], "readwrite")
.objectStore(storeName) // 仓库对象
.delete(key);
// 操作成功
req.onsuccess = function (e: { target: { result: any } }) {
resolve({
code: 0,
success: true,
data: e?.target?.result,
msg: "数据删除成功!",
});
};
// 操作失败
req.onerror = function () {
const data = {
code: -1,
success: false,
data: null,
msg: "数据删除失败!",
};
resolve(data);
};
});
};
/**
* 使用游标查询数据
* @param {object} db 数据库实例
* @param {string} storeName 仓库名称
* @param {string} indexKey 查询的索引的键值
* @param {string} index 查询的索引值
**/
export const getIndexData = function (
db: any,
storeName: string,
indexKey: string,
index: string
) {
return new Promise((resolve, reject) => {
if (!db) {
reject("数据库不存在或没有初始化");
}
const keyRange = IDBKeyRange.only(index);
const req = db
.transaction([storeName], "readonly")
.objectStore(storeName) // 仓库对象
.index(indexKey)
.openCursor(keyRange, "next");
// 操作成功
req.onsuccess = function (e: { target: { result: any } }) {
resolve({
code: 0,
success: true,
data: e?.target?.result,
msg: "数据查询成功!",
});
};
// 操作失败
req.onerror = function () {
const data = {
code: -1,
success: false,
data: null,
msg: "数据查询失败!",
};
resolve(data);
};
});
};
Loading...
马建仓 AI 助手
尝试更多
代码解读
代码找茬
代码优化
JavaScript
1
https://gitee.com/yinlingyun123/pureVue3.git
git@gitee.com:yinlingyun123/pureVue3.git
yinlingyun123
pureVue3
pureVue3
master

Search