问如何通过objectstore.add()获取添加到IndexedDB中的对象的(自动递增的) id？
EN

Stack Overflow用户

提问于 2020-08-31 11:25:24

回答 1查看 53关注 0票数 1

我正在开发一个WebExtension，并使用IndexedDB来存储对象。当我存储一个新对象时，它并不是唯一的。因此，我使用一个自动递增的id来使其唯一。在第一次添加之后，我将做一些工作，修改/更新一些属性，因此必须更新数据库中的对象。但是要更新一个对象，我需要知道它的ID，但到目前为止我还不知道。

这是我向数据库添加对象的代码：

const dbName = "MyDb";
const dbVersion = 1;
const storeName = "MyStore";

function addObject(obj) {
    const request = window.indexedDB.open(dbName, dbVersion);
    request.onupgradeneeded = event => {
        const db = event.target.result;
        const objectStore = db.createObjectStore(storeName, { keyPath: 'id', autoIncrement: true });
    }
    request.onsuccess = event => {
        const db = event.target.result;
        const transaction = db.transaction(storeName, 'readwrite');
        const objectStore = transaction.objectStore(storeName);
        objectStore.add(obj);
        transaction.onerror = event => {
            console.error('Error while adding an object: ', event.target.error.message);
        };
        // How do I get/return the ID of the previously added object?
        transaction.onsuccess = event => {
            console.log(event.target.result);
        };
        transaction.oncomplete = event => {
            console.log(event.target.result);
        };
    }
}

addObject({prop1: "foo", prop2: "bar", prop3: "", prop4: ""});

类似问题的答案- here和here -建议在成功添加后查询event.target.result，但在上面的代码中返回undefined，尽管对象已经成功插入。

那么，有没有办法获取刚刚添加的对象的ID呢？

javascript

indexeddb

回答 1

Stack Overflow用户

回答已采纳

发布于 2020-09-01 06:30:57

结果是，我监听了错误的事件处理程序。您必须监听查询的onsuccess，而不是监听事务的onsuccess/oncomplete。

此外，我将所有内容都包装到一个Promise中，以便能够在id可用时立即获得它。

这是一个有效的示例：

const dbName = "MyDb";
const dbVersion = 1;
const storeName = "MyStore";

function addObject(obj) {
    return new Promise(function(resolve) {
        const request = window.indexedDB.open(dbName, dbVersion);
        request.onupgradeneeded = event => {
            const db = event.target.result;
            const objectStore = db.createObjectStore(storeName, { keyPath: 'id', autoIncrement: true });
        };
        request.onsuccess = event => {
            const db = event.target.result;
            const transaction = db.transaction(storeName, 'readwrite');
            const objectStore = transaction.objectStore(storeName);
            const query = objectStore.add(obj);
            transaction.onerror = event => {
                console.error('Error while adding an object: ', event.target.error.message);
            };
            query.onsuccess = event => {
                return resolve(event.target.result); // OR: return resolve(query.result);
            };
        };
    });
}

let id = await addObject({prop1: "foo", prop2: "bar", prop3: "", prop4: ""});