IDBRequest success 事件

admin發表於2019-09-23
事件

IndexedDB資料庫絕大多數操作都是非同步的，與AJAX類似。

非同步操作不會直接返回請求結果，返回一個請求物件。

在IndexedDB資料庫中，這個請求物件是IDBRequest型別或者其子型別。

可以通過請求物件的success事件監聽請求是否成功。

關於事件處理函式註冊，可以參閱如何註冊事件處理函式一章節。

下面通過程式碼例項進行一下演示：

[HTML] 純文字檢視 複製程式碼執行程式碼
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>螞蟻部落</title>
<script>
let request = window.indexedDB.open("antzone", 1);
 
request.onupgradeneeded = (ev) => {
  let db = ev.target.result;
  if (!db.objectStoreNames.contains('students')) {
    let objectStore = db.createObjectStore('students',{keyPath:"id"});
    objectStore.createIndex("xingbie","sex",{ unique: false });
  }
}
 
request.onsuccess = (ev) => {
  let db = ev.target.result;
  let transaction = db.transaction(['students'], 'readwrite');
  let objectStore = transaction.objectStore('students');
  let addRequest = objectStore.add({
    id:1,
    name:"螞蟻部落",
    age:20,
    sex:"男"
  });
  addRequest.onsuccess = (ev) => {
    console.log("資料新增成功");
  }
}
</script>
</head>
<body>
  <p>為物件倉庫新增資料</p>
</body>
</html>

程式碼執行效果截圖如下：

a:3:{s:3:\"pic\";s:43:\"portal/201909/23/144950hvviivyvjyxwr5vr.jpg\";s:5:\"thumb\";s:0:\"\";s:6:\"remote\";N;}

上面程式碼可以為物件倉庫新增一條記錄，objectStore.add()方法是一個非同步操作。

返回一個請求物件，通過監聽此物件的success事件，就可以知道何時新增成功，並進行響應操作。

資料庫的其他操作大多也是類似非同步操作，比如刪除或者修改，還有資料庫的開啟連線操作。

相關文章