Firefox webextensions：如何获取存储长度并迭代对象

我需要使用本地存储在webextensions中存储对象。下面显示了一个简单的代码（我在这里将

标题

和

内容

作为固定字符串，但我可能需要将它们作为输入）

将对象插入本地存储后，我需要在HTML表最后一行的HTML页面中动态显示它

为此，我需要表长度（可以实现）和存储长度（无法实现）来访问存储中存储的最后一个对象，获取其值，并将它们插入HTML表的最后一行

我面临两个问题。因为我没有处理存储器中的数组，所以我不知道如何获取存储项的长度以及如何访问最后添加的项和任何项（例如，使用索引号访问数组）。我正在重新编写webextension的SDK代码。所以，我习惯于将项目作为对象数组存储在存储器中。我真的无法在webextension中执行此操作，需要您的帮助。除非我真的做错了什么，否则我更愿意用最小的改动重新编写它。Iwas所做的是检索存储区中的最后一个项目，在HTML表中创建新行并添加它，然后我得到存储在存储区中并显示在HTML表中的项目

在控制台中，当我在控制台中记录

行

时，我只看到单词

对象

。如何逐个访问对象以获取其属性，从而在HTML页面中显示它们

你能澄清一下吗

1）

index.js

function insertRow()
{
  var title = "XYZ" //I'm using fixed value but this is can be multiple objects read from the user whenever he inserts a new objects.
  var content = "X";
  storeRow(title,content);
}//end insertRow

    //---------------------------------------------
function onError(error) {
  console.log(`Error: ${error}`);
}
//----------------------------------------------
function onGot(rows){
  console.log("onGot: "+rows.length); //row.length - does not work
}
//-------------------------------------
function storeRow(title,content)
{
  var rows = {}; //define object
  rows.title = title;
  rows.content = content;

  var storingRow = browser.storage.local.set(rows); //insert the object to the storage.
  console.log("row inserted");
  storingRow.then(() => {
  displayRow(rows);
  }, onError);
}//end storeRow
//--------------------------------------

function displayRow(rows)
{
  let gettingItem = browser.storage.local.get();
  gettingItem.then(onGot, onError);
}//end displayRow

2）

manifest.json

：

{
    "manifest_version": 2,
    "name": "test",
    "version": "1.0",

"background": {
    "scripts": ["index.js"]
  },

    "permissions":[
        "activeTab",
        "storage"
    ],

}

更新： 具体来说，在SDK中，我曾经这样做来定义存储阵列：

if(!info.storage.myStorage) 
{
    info.storage.myStorage = []; //declare a new storage. 
}//end if

然后，将对象推到其上。 var myObject={}//定义对象

myObject.title = "cccc";
myObject.content="zzzz";
info.storage.myStorage.push(myObject);

---

然后，我可以根据

行id

从HTML页面中

编辑

，

更新

，以及

删除

存储项。其思想是，将项目存储在存储器中后，它将显示在HTML页面中。例如，我在每一行中都有

edit

的链接，当用户单击它时，我会从

edit

按钮（按行编号）的

id

识别存储阵列

索引。但是，在webextensions中，我没有数组，当用户单击
编辑
时，我需要通过
行
编号来识别存储元素。你知道怎么做吗？如果没有办法，还有什么办法呢？
首先在本地存储中存储一个数组而不是每一行，然后将每一行存储在本地存储中的数组中

browser.storage.local.get("rows")
.then((rows =>
{
  var row = {};
  row.title = title;
  row.content = content;
  rows.push(row);

  return browser.storage.local.set("rows", rows);
}))
.then(() => console.log("row inserted"))
.then(() => browser.storage.local.get("rows"))
.then(displayRows);

首先将阵列存储在本地存储中，而不是每行，然后将每行存储在存储在本地存储中的阵列中

browser.storage.local.get("rows")
.then((rows =>
{
  var row = {};
  row.title = title;
  row.content = content;
  rows.push(row);

  return browser.storage.local.set("rows", rows);
}))
.then(() => console.log("row inserted"))
.then(() => browser.storage.local.get("rows"))
.then(displayRows);

每次存储一行时，您所做的操作似乎都在覆盖相同的数据
标题
和
内容
。为什么只选择一个键名会出现这样的问题，您可以在
storage.local
中将数组存储为一个数组？如果您希望在每次
.push（）
或
pop（）
等操作时存储它，那么只需定义函数即可，或者创建一个新对象，当您调用这些方法时，该对象就会这样做。您是指每个对象都有一个键吗？我无法选择键，因为
标题
和
内容
是从表单读取的，并作为用户的输入。我不会像在这个简单的示例中那样手动输入这些值。那么如何在每次用户输入值时分配自动键呢？我想要的是，用户可以输入任意数量的
标题
和
内容
。我想编辑、删除、更新这些值。编辑、删除和更新是按钮，具有单击事件。单击它们时，我需要引用与它们对应的存储中的行/索引或键。单击编辑、删除或更新按钮时，我所拥有的只是行索引（取自按钮的id），然后我从中引用存储并更新或删除。如果没有数组，我无法完成此操作。或者，我需要更多的说明和示例来说明如何在没有数组的情况下完成此操作。
为什么只选择一个键名会出现这样的问题，而您在storage.local中使用它来将数组存储为数组？
您能用代码解释一下吗？我不知道您是否指每个对象的键名？还是对于所有对象？如果为每个对象指定，如何使其自动指定？如果你看我帖子中的更新，请看看我以前做过什么。这就是我现在需要做的。我很高兴这样做，但代码基本上与我在前面的问题中使用的代码相同。在这个答案中，我使用键
myArray
来存储一个对象数组，这似乎是您想要的。它以数组的形式存储，以数组的形式检索，这就是我理解您想要的。显然，数组中的每个对象都可以有任意的键/值对（只要它们仍然是JSON可验证的（例如，没有循环引用；没有DOM元素；没有函数等等）。如果您想要的不是这些，请进一步解释。您所做的看起来像是每次存储行时都在覆盖相同的数据
title
和
content
。为什么只选择一个键名会出现这样的问题，您可以在
storage.local
中将数组存储为一个数组？如果您希望在每次
.push（）
或
pop（）
等操作时存储它，那么只需定义函数即可，或者创建一个新对象，当您调用这些方法时，该对象就会这样做。您是指每个对象都有一个键吗？我无法选择键，因为
标题
和
内容
是从表单读取的，并作为用户的输入。我不会像在这个简单的示例中那样手动输入这些值。那么如何在每次用户输入值时分配自动键呢？我想要的是，用户可以输入任意数量的
标题
和
内容
。我想编辑、删除、更新这些值。T