IDBTransaction.mode

admin發表於2019-09-21

此屬性可以返回當前事務的操作模式，只讀屬性。

關於事務更多內容可以參閱indexedDB transaction 事務一章節。

在當前標準下，有三個可能返回值：

（1）.readonly：只讀。

（2）.readwrite：可讀寫。

（3）.versionchange：版本變化（後面會詳細介紹）。

語法結構：

[JavaScript] 純文字檢視 複製程式碼
let currentMode = IDBTransaction.mode;

下面通過程式碼例項對此屬性進行一下演示。

[HTML] 純文字檢視 複製程式碼執行程式碼
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>螞蟻部落</title>
<script>
let students=[
  { 
    id:1001, 
    name:"張三", 
    age:21,
    sex:"男"
  },{ 
    id:1002, 
    name:"李四", 
    age:20,
    sex:"女"
  },{ 
    id:1003, 
    name:"王五", 
    age:19,
    sex:"女"
  }
];

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',{autoIncrement:true});
    objectStore.createIndex("xingbie","sex",{ unique: false });
  }
}

request.onsuccess = (ev) => {
  let db = ev.target.result;
  let transaction = db.transaction(['students'], 'readwrite');
  // 列印出事務的操作模式
  console.log(transaction.mode);
  let objectStore = transaction.objectStore('students');
  for(let i=0;i<students.length;i++){
    objectStore.add(students[i]);
  }
}
</script>
</head>
<body>
  <p>列印出事務的操作模式</p>
</body>
</html>

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

$a:3:{s:3:\"pic\";s:43:\"portal/201909/21/121701gjjm6jxe1mp6n14p.jpg\";s:5:\"thumb\";s:0:\"\";s:6:\"remote\";N;}$

程式碼簡單說明如下：

（1）.db.transaction(['students'], 'readwrite')，將事務與物件倉庫關聯起來，模式是可讀寫。

（2）.console.log(transaction.mode)，可以列印出對應事務的模式。

下面再來看一下versionchange模式，程式碼例項如下：

[HTML] 純文字檢視 複製程式碼執行程式碼
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>螞蟻部落</title>
<script>
let students=[
  { 
    id:1001, 
    name:"張三", 
    age:21,
    sex:"男"
  },{ 
    id:1002, 
    name:"李四", 
    age:20,
    sex:"女"
  },{ 
    id:1003, 
    name:"王五", 
    age:19,
    sex:"女"
  }
];

let request = window.indexedDB.open("antzone", 1);
request.onupgradeneeded = (ev) => {
  // 列印出事務的操作模式
  console.log(ev.target.transaction.mode);
  let db = ev.target.result;
  if (!db.objectStoreNames.contains('students')) {
    let objectStore = db.createObjectStore('students',{autoIncrement:true});
    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');
  for(let i=0;i<students.length;i++){
    objectStore.add(students[i]);
  }
}
</script>
</head>
<body>
  <p>列印出事務的操作模式</p>
</body>
</html>

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

$a:3:{s:3:\"pic\";s:43:\"portal/201909/21/121724q3zx2efl34fjim66.jpg\";s:5:\"thumb\";s:0:\"\";s:6:\"remote\";N;}$

程式碼分析如下：

（1）.readonly和readwrite兩種都可以人為規定，但是versionchange不可以。

（2）.此模式事務會在upgradeneeded事件觸發時候自動建立。

（3）.ev.target獲取request物件，此物件的transaction屬性可以返回當前的事務。