javascript - 将数组保存到本地存储

标签 javascript arrays async-await local-storage firefox-addon-webextensions

<分区>

我是 WebExtensions 和 JavaScript 的新手。我正在尝试编写一个带有 pageAction 按钮的小扩展程序,该按钮仅在单击时将当前 URL 保存到本地存储(即一些非常简单的“收藏夹”功能)。但是,我在使用 chrome.storage.local.set().get() 时遇到了问题。我一直在查看 this question 中的代码和 this question尝试将其重新用于我的目的,但惨遭失败。这是我目前拥有的。

saveURL() 函数应该在本地存储中加载数组,用新的 URL 更新它,然后将它保存回本地存储(目前,我只有一个无用的字符串我正在尝试推送到那个数组)。

async function saveURL() {
  console.log("Save URL called.");
  var urls = await loadURLs();
  console.log(urls);
  urls.push("a-new-url")
  console.log(urls);
  chrome.storage.local.set({'pearsurls': urls});
  urls = await loadURLs();
  console.log(urls);
  return true;
}

loadURLs() 函数应该从本地存储中检索内容。我在 storage.local.get() 中使用默认值来在第一次使用时初始化数组。

function loadURLs(){
  var pearsurls = []
  console.log("Loading all saved URLs");
  chrome.storage.local.get({pearsurls: []}, function (result) {
    pearsurls = result.pearsurls;
    console.log(pearsurls)
  });
  console.log(pearsurls)
  return pearsurls;
}

控制台中的输出给我:

Save page  save.js:52:3
Save URL called.  save.js:5:3
Loading all saved URLs  save.js:38:3
Array [  ]  save.js:43:3
Array [  ]  save.js:7:3
Array [ "a-new-url" ]  save.js:9:3
Loading all saved URLs  save.js:38:3
Array [  ]  save.js:43:3
Array [  ]

即我的 loadURLs() 函数似乎没有做任何事情...我做错了什么?

最佳答案

您的函数 loadURLs 既不是 async 也不是返回 Promise,因此它立即以空数组结束。

试试这个:

function loadURLs(){
  console.log("Loading all saved URLs");
  return new Promise((resolve, reject) => {
    console.log("Promise");
    chrome.storage.local.get({pearsurls: []}, function (result) {
      console.log(result.pearsurls);
      resolve(result.pearsurls);
    });
  });
}

注意:您的原始函数在 chrome.storage.local.get 完成其工作之前结束。数组 pearsurls 首先返回空值,并在代码执行后随时使用回调 function (result) ... 对其进行填充。

关于javascript - 将数组保存到本地存储,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45264148/

相关文章:

javascript - Node.js 和 Express : wait for asynchronous operation before responding to HTTP request

JavaScript 回调返回值

c# - 我什么时候使用 Task.Yield()?

c# - 如何在同步代码.NET 4.5 中等待所有并发任务完成?

c - 如何使用 malloc 将 C 中的 int 变量转换为 char *array?

arrays - 数组范围补码

javascript - 过滤 2 个数组以在 React/JSX 中呈现一个值

javascript - node js中response.send和response.write的区别

javascript - 一次选择一个单选按钮

javascript - 在 jquery-ui 选项卡中创建动态选项卡