javascript - 如何将参数传递到 Chrome Storage get 函数中，并将该参数设置为键？

Question

所以我有这个函数，应该使用 chrome 存储 API 返回设置键的保存值:

 function loadBtn(id) {
  return new Promise(resolve => {
    chrome.storage.sync.get([id], function(result) {
      resolve(result.id);
    });
  });
}

基本上，我正在查看具有相同类的所有元素，并保存它们的背景颜色值，并将键设置为其 ID。这就是我的意思(favBtnBG 只是一个 RGB 值):

$('.colorBtn').click(function() {
  let favBtnBG = await loadRbgVal();
  var id = $(this).attr('id');
  chrome.storage.sync.set({ [id]: favBtnBG });
})

问题是，当我尝试调用 loadBtn 函数时，它返回未定义。这是我的称呼(控制台注销未定义)

$('.colorBtn').someListener(function() {
  highlightedRgbVal = await loadBtn($(this).attr('id'));
  console.log(highlightedRgbVal)
})

在我看来，可能存在两个错误。首先是我没有在存储中正确设置值。我认为通过在设置键时使用括号，变量id的值被用作键，而不是字符串id，但是如果我我错了。

第二个可能的错误是我的 loadBtn 函数有问题。在我开始将 id 传递给它之前，该函数就可以工作，所以我认为我没有正确传递它。

话虽如此，如何正确地将参数传递给 storage.sync.get() 函数？

Answer 1

const id = 'valueOfID';
chrome.storage.sync.get([id], function(result) {
      console.log(result[id]);
});

在这种情况下，id 的值被替换，如果您的存储如下所示:

{
      valueOfID: 'whateveryousetit'
}

然后您将记录whateveryousetit。如果您只想读取存储 key ID，则:

chrome.storage.sync.get(['id'], function(result) {
      console.log(result.id);
});

使用此存储:

{
      id: 'yourvalue'
}

您将记录您的值(value)

我认为你不能像这样将异步等待和 promise 结合起来。您可以像这样调用当前的加载函数:

loadBtn(id).then(idValueFromStorage) => {
   console.log(idValueFromStorage)
}

就我个人而言，我认为为存储获​​取创建 promise 包装器是毫无意义的。您可以使用以下语法使其变得非常干净:

chrome.storage.sync.get(['yourStorageKey'], ({ yourStorageKey }) => {
    console.log(yourStorageKey);
});