Question

尝试为firefox插件/扩展版本64.0实现选项页面。我正在使用browser.storage.local.se t来存储数据。但是当我使用browser.storage.local.get提取数据时，结果是控制台日志上的<unavailable>。

以下是我在options.js文件中运行的功能（我在表单字段njnj上输入了gateway，然后点击了提交按钮）

function saveOptions(e) {
  e.preventDefault();
  console.log("you are here")
  console.log(document.querySelector("#gateway").value)
  browser.storage.local.set({
  "gateway": document.querySelector("#gateway").value  });
  console.log(browser.storage.local.get("gateway"))
}

document.querySelector("form").addEventListener("submit", saveOptions);

我在控制台日志中的实际输出如下：

you are here                                         options.js:4:3
njnj                                                options.js:5:3
<unavailable>                                       options.js:8:3

Answer 1

好的，所以我确实部分弄清了上面的代码为什么不起作用。问题是browser.storage.local.get（）在javascript中返回了“ promise”（我实际上还不知道这是什么意思）。因此，您必须具有一个可以从该“承诺”实际检索答案/保存的值的代码。我将为您提供有关如何检索值的示例：

// first save a key value pair into storage
browser.storage.local.set({"key": 'value'})

// to retrieve this value, first declare a new variable
var savedvalue = "zero"

// retrieve the 'promise' of key value pair, then run the associated function to get
//the savedvalue and set it equal to previously declared variable. 
browser.storage.local.get(['key'], function(result) {savedvalue = result.key});

// now, when you call savedvalue (even outside the function above), it will return 'value'
console.log(savedvalue)

output>> value

Answer 2

你可以像这样使用异步函数和等待

async function saveOptions(e) {

  e.preventDefault();      
  await browser.storage.local.set(
    { "gateway": document.querySelector("#gateway").value }
  );
}

document.querySelector("form").addEventListener("submit", async saveOptions);

您不需要将 'e' 传递给函数，您没有对它做任何事情。如果心情好，你也可以这样重构

document.querySelector("form").addEventListener( "submit", async ()=> {
    e.preventDefault();      
    await browser.storage.local.set(
      { "gateway": document.querySelector("#gateway").value }
    );
});

无法从browser.storage.local.get中提取数据

2 个答案: