javascript - 为什么 foreach 重写值而不是返回所有值

Question

以下是创建 dom 时需要存储在本地存储中的数组。

  this.headers.push( 
   {
      text: "Name",
      align: "center",
      sortable: true,
      value: "name",
      align: "start",
    },
    {
      text: "Company",
      align: "center",
      sortable: true,
      value: "company",
      align: "start",
    },
    {
      text: "Phone",
      align: "center",
      sortable: true,
      value: "phone",
      align: "start",
    },
   )]

每个对象的值需要存储在 key name 下的 localstorage 上el_columns。所以我尝试如下。

   this.headersList.forEach((element) => {
      localStorage.setItem(
        "el_columns",
        JSON.stringify(element.value)
      );
    });

上面的代码工作正常，但只存储一个值，即最后一个对象值phone。我期望的输出如下['name', 'company', 'phone']

标签： javascriptarraysvue.jsvuejs2local-storage

Answer 1

尝试这个

 this.headersList.forEach((element) => {
      localStorage.setItem(
        "el_columns_"+element.text,
        JSON.stringify(element.value)
      );
    });