indexedDB简单使用

let db;

// 打开indexedDB
export function openDB(dbName, version) {
  return new Promise((resolve, reject) => {
    let indexedDB = window.indexedDB || window.mozIndexedDB || window.webkitIndexedDB || window.msIndexedDB;
    // 打开数据库，没有就创建
    let request = indexedDB.open(dbName, version);
    // 失败回调
    request.onerror = function (event) {
      console.error('IndexedDB 打开失败');
      reject()
    }
    // 成功回调
    request.onsuccess = function (event) {
      db = request.result;
      resolve(db)
    }
    // 更新回调
    request.onupgradeneeded = function (event) {
      db = request.result;
      // 创建表(imgs)，定义主键id
      let objStore = db.createObjectStore('imgs', { keyPath: 'itemId' });
      // 创建索引
      objStore.createIndex('itemId', 'itemId', { unique: true });
    }
  })
}

// 插入数据
export function addData(storeName, data) {
  var request = db.transaction([storeName], 'readwrite') // 事务对象，指定表名和操作模式("只读"或"读写")
    .objectStore(storeName) // 仓库对象
    .add(data); // 插入数据

  request.onsuccess = function (event) {
    console.log('数据插入成功');
  }

  request.onerror = function (event) {
    console.error('数据插入失败');
  }

}

// 查询全部数据
export function getAllData(storeName) {
  return new Promise((resolve, reject) => {
    var request = db.transaction([storeName]).objectStore(storeName).getAll();

    request.onsuccess = function (event) {
      var result = request.result;
      resolve(result)
      console.log('获取全部数据成功', result);
    }

    request.onerror = function (event) {
      reject(false)
      console.error('获取全部数据失败');
    }
  })
}

// 通过主键查询数据
export function getDataByKey(storeName, key) {
  return new Promise((resolve, reject) => {
    var request = db.transaction([storeName]).objectStore(storeName).get(key);

    request.onsuccess = function (event) {
      var result = request.result;
      resolve(result)
      console.log('查询数据成功', result);
    }

    request.onerror = function (event) {
      reject(false)
      console.error('查询数据失败');
    }
  })
}

// 通过游标查询数据
export function getDataByCursor(storeName, range) {
  return new Promise((resolve, reject) => {
    var request = db.transaction([storeName]).objectStore(storeName).openCursor(range);
    let list = []
    // 开启游标成功，逐行读数据
    request.onsuccess = function (event) {
      var cursor = event.targer.result;
      if (cursor) {
        list.push(cursor.value);
        cursor.continue();  // 遍历储存对象所有内容
      } else {
        return list
      }
    }

  })
}

// 更新数据, 根据主键判断，存在就更新，不存在就添加
export function updateData(storeName, data) {
  console.log('更新数据', data);
  var request = db.transaction([storeName], 'readwrite').objectStore(storeName).put(data);

  request.onsuccess = function (event) {
    console.log('更新成功');
  }

  request.onerror = function (event) {
    console.error('更新失败');
  }
}

// 通过主键id删除数据
export function deleteData(storeName, id) {
  var request = db.transaction([storeName], 'readwrite').objectStore(storeName).delete(id);

  request.onsuccess = function (event) {
    console.log('删除数据成功');
  }

  request.onerror = function (event) {
    console.error('删除数据失败');
  }
}