Question

我正在制作Chrome扩展程序，并想知道使用Chrome的异步本地存储get的最佳方法是什么。我想在用户的存储中使用一个数字来返回要显示的右图。我有这个函数可以将window的{{1}}属性设置为图片的正确网址：

sheetURL

在我将var getCurSheet = function(){ chrome.storage.local.get('sheet', function(data){ $.isEmptyObject(data) ? sheetNum = 1 : sheetNum = data[0]; switch (sheetNum) { case 1: window.sheetURL = 'http://i.imgur.com/QlTafAU.png'; case 2: window.sheetURL = 'http://i.imgur.com/jLGpcKz.png'; case 3: window.sheetURL = 'http://i.imgur.com/2uAyumP.png'; default: window.sheetURL = 'http://static.koalabeast.com/images/flair.png'; } }); }的来源设置为<img>中存储的链接之前，会调用此方法：

window.sheetURL

虽然这有效，但我觉得这不是处理异步调用的最佳解决方案。有没有更好的方法来处理这类事情？

Answer 1

您正在寻找的内容称为Promise。

未经测试，但请尝试重构：

function getCurSheet () {
   var sheetUrls = {
      1: 'http://i.imgur.com/QlTafAU.png',
      2: 'http://i.imgur.com/jLGpcKz.png',
      3: 'http://i.imgur.com/2uAyumP.png'
   };
   var defaultSheetUrl = 'http://static.koalabeast.com/images/flair.png';
   return new Promise(function (resolve, reject) {
      chrome.storage.local.get('sheet', function(data) {
         resolve(sheetUrls[data] || defaultSheetUrl);
      });
   });
}

getCurSheet().then(function (url) {
   $('<img>').attr({
      src: url,
      id: 'flairs'
   });
});

正确使用Chrome本地存储的方法获取

1 个答案: