在 LocalStorage 对象中附加响应数据

Question

我有一个前端，当有人访问 URL（如 /products/1、/products/2）时，它会自动发送一个 id，它会将 1 或 2 之类的 id 发送到服务器，然后服务器发送该 id 的响应回到浏览器，现在我想在localStorage中保存这个响应，但是当有人访问时，/1它会将响应保存在本地存储中，但是现在当有人访问时，/2它会替换之前的本地存储值而不是添加新的，如何我可以继续向 localStorage 添加新数据而不是更新以前的值吗？

fetch("/apps/proxy/sendid", {
        method: "POST",
        headers: {'Content-Type': 'application/json'}, 
        body: JSON.stringify(jspid)
      }).then(function (response) {
        // The API call was successful!
        console.log(response);
        return response.json();
      }).then(function (data) {
        // This is the JSON from our response
         // This is the JSON from our response
        console.log(data);

        const productsDetails = [];

        productsDetails.push(data);
        
        localStorage.setItem('future', JSON.stringify(productsDetails));

      }).catch(function (err) {
        // There was an error
        console.warn('Something went wrong.', err);
      });
  }

Answer 1

首先，从 localStorage 中获取当前项目并将它们分配给productsDetails。然后将下一个项目附加到数组中。

let productsDetails = localStorage.getItem('future');

if(null === productsDetails) {
    productsDetails = [];
}

productsDetails.push(data);
            
localStorage.setItem('future', JSON.stringify(productsDetails));