javascript - 如何同步使用localForage

Question

我有一个 Cordova 移动应用程序，可将离线数据存储在 localStorage 中。最近用户开始收到 QUOTA_EXCEEDED_ERR 错误，因为 localStorage 有 5MB 限制。我决定使用“localForage”框架，但我注意到它是异步工​​作的。由于我不想将所有复杂的应用程序重写为回调函数，因此我想知道是否有某种方法可以同步使用“localForage”（等到 getItem 函数返回值）。

这是我正在尝试做的代码示例：

localforage.setItem('testKey', 'testValue', function() {
  var value = getValue('testKey');

  console.log(value); // here I get undefined, but I want to get a value
});

function getValue(key) { // I want this function to return value
  var result;
    localforage.getItem(key, function(value) {
    result = value;
  });

  return result;
}

我希望 getValue() 返回一个值而不更改任何其他代码

Answer 1

根据这个链接

localForage 有一个双重 API，允许您使用 Node 样式的回调或 Promises。如果您不确定哪一个适合您，建议使用 Promises。

因此，如果您愿意，可以使用其中的任何一个。如果使用承诺，您可以使用async/await来等待结果

localforage.setItem('testKey', 'testValue', async function() {
  var value = await getValue('testKey')

  console.log(value); // here I get undefined, but I want to get a value
});

 async function getValue(key) { 
  var result = await localforage.getItem(key);
  return result;
}

jsfiddle

Answer 2

localforage.setItem('testKey', 'testValue', async function() {//declare function as async
  var value = await getValue('testKey'); //wait for the value

  console.log(value); // "testValue" value should show in console
});

//declare function as async
async function getValue(key) {
  var result = await localforage.getItem(key); //wait for the localforage item

  return result;
}

JSFiddle在这里：https ://jsfiddle.net/mvdgxorL/

Answer 3

https://localforage.github.io/localForage/#data-api-getitem，使用async/ await：

try {
    const value = await localforage.getItem('somekey');
    // This code runs once the value has been loaded
    // from the offline store.
    console.log(value);
} catch (err) {
    // This code runs if there were any errors.
    console.log(err);
}