单击按钮以存储 localstorage 数组并显示与 ionic 中的列表视图相同答案

【问题标题】：Click on button to store localstorage array and display the same as list view in ionic单击按钮以存储 localstorage 数组并显示与 ionic 中的列表视图相同
【发布时间】：2020-12-17 15:35:45
【问题描述】：

在我的 ionic 应用程序中，我想将值作为数组存储在本地存储中，而不是替换该值。

我正在使用以下查询，但无法保存数组。

每次点击，它都会替换值。

我的 home.ts 有以下查询。

var today = new Date();
var date = today.getFullYear()+'-'+(today.getMonth()+1)+'-'+today.getDate();
var time = today.getHours() + ":" + today.getMinutes() + ":" + today.getSeconds();
var dateTime = date +' '+time;   

var items = [];
items.push(dateTime);
localStorage.setItem("item", JSON.stringify(items));

请指出我在哪里做错了。

localstorage 中的输出如下。对于每次点击，它都会替换值。

**Key**                        **Value**
 item                   ["2020-8-29 12:6:50"]

【问题讨论】：

不是很清楚，你想达到什么目的？，还有，有什么问题？
我已更新查询。请看看是否有帮助。实际上我想在本地存储中保存一个数组，而不是替换同一个键中的现有值
我想，他期待 addItem() 功能

标签： html angular ionic-framework local-storage

【解决方案1】：

您需要将新值或条目连接到存储的值。您可以通过三个简单的步骤完成此操作：

检索存储的值数组，
连接或推送新值（这取决于期望结果），
存储2)的结果数组

按照你的代码，它会是这样的，

const storedValue = JSON.parse(localStorage["datearray"]); // 1
const newValue = storedValue.push(dateTime); // 2 - with the result will be [[v1]..[vn]]
localStorage["datearray"] = JSON.stringify(newValue); // 3

顺便说一句，如果您打算使用变量localStorage 将值保存在内存中，您可以只保留数组。然后在应用程序启动时使用存储的数组值初始化此变量，并在关闭或需要时保存它。在获取或设置数组的值时，您将字符串转换为数组，反之亦然。

更新

就像我提到的那样，问题在于您没有扩展要替换它的结果。让我尝试用一个向存储数组添加新值的函数再次解释一下。

function addToStoredArray(key, item, storage) {
  // 1.1) retrieve stored array
  storage.get(key)
    .then(val => {
      // 1.2) convert to array
      const arr = JSON.parse(val);
      // 2) add new item to array
      arr.push(item);
      // 3)store again the array
      storage.set(key, JSON.stringify(arr));
    });
}

现在，按照你的代码，你只需要像这样调用函数，

// create new value
var today = new Date();
var date = today.getFullYear()+'-'+(today.getMonth()+1)+'-'+today.getDate();
var time = today.getHours() + ":" + today.getMinutes() + ":" + today.getSeconds();
var dateTime = date +' '+time;
// add it to the stored array   
addToStoredArray("item", JSON.stringify(items), localStorage);

希望它更清楚一点。

【讨论】：

我跟着，但它抛出错误“storedValue.push 不是函数”。我的代码如下：localStorage["datearray"] = JSON.stringify(dateTime); var storedValue = JSON.parse(localStorage["datearray"]);1 var newValue = storedValue.push(dateTime); localStorage["datearray"] = JSON.stringify(newValue);
我已经用少量信息更新了原始查询。

【解决方案2】：

我已经通过以下解决方案解决了这个问题。

var time= "10"; 
localStorage.setItem('datatemp', time);
            const task = localStorage.getItem('datatemp');            
            let data;
            if(localStorage.getItem('data') === null) {
              data= [];
            } else {
              data= JSON.parse(localStorage.getItem('data'));
            }
            data.push(task);
            localStorage.setItem('data', JSON.stringify(data));

在本地存储中，它将保存数据如下：

data = ["10","10"...]

【讨论】：