Как добавить новое значение в массив, который находится в local storage, не заменяя его последним?

Как сделать так, чтобы при добавлении карточек в корзину все они сохранялись, а не только последняя?
  • 29 апреля 2024 г. 11:00
Ответы на вопрос 3
Для добавления нового значения в массив, который находится в local storage, не заменяя его последним, можно выполнить следующие шаги:

1. Получить текущий массив из local storage.
2. Добавить новое значение в этот массив.
3. Сохранить обновленный массив обратно в local storage.

Пример кода:

```javascript
// Получаем текущий массив из local storage
let currentArray = JSON.parse(localStorage.getItem('myArray')) || [];

// Добавляем новое значение в массив
currentArray.push('новое значение');

// Сохраняем обновленный массив обратно в local storage
localStorage.setItem('myArray', JSON.stringify(currentArray));
```

Чтобы сохранить все карточки при добавлении их в корзину, а не только последнюю, необходимо при каждом действии добавления карточки в корзину выполнять вышеописанные шаги. Таким образом, каждая карточка будет добавляться в массив в local storage, а не заменять его предыдущее значение.
В первом куске кода замените <br/> <pre><code class="javascript">const productInfoStorage = localStorage.setItem('productInfo', JSON.stringify([cartCardHTML]))</code></pre> <br/> на <br/> <pre><code class="javascript">const alreadyInStorage = JSON.parse(localStorage.getItem('productInfo'));
const productInfoStorage = localStorage.setItem('productInfo', JSON.stringify([...alreadyInStorage, cartCardHTML]))</code></pre> <br/> Иначе вы всегда в productInfo пишете массив с одним элементом
<blockquote>Как сделать так, чтобы в массив, который находится в local storage записывалось новое значение, а не заменялось на последнее?<br/>
</blockquote> <br/> <blockquote>Этот код находится на главной странице, откуда берутся данные</blockquote> <br/> <pre><code class="javascript">let products = localStorage.getItem('productInfo');
products = products ? JSON.parse(products) : [];
products.push(cartCardHTML);
localStorage.setItem('productInfo', JSON.stringify(products));</code></pre> <br/> <blockquote>Этот код находится на странице с корзиной</blockquote> <br/> <pre><code class="javascript">const cartCardBox = document.querySelector('.cart-card-box');
const cartNothingTitle = document.querySelector('.basket-clear-title');

if (localStorage.length &gt; 0) {
  cartNothingTitle.style.cssText = "position: absolute; opacity: 0; pointer-events: none;";
  const products = JSON.parse(localStorage.getItem('productInfo')) ?? [];
  products.forEach((product) =&gt; {
    cartCardBox.insertAdjacentHTML('beforeend', product);
  });
}</code></pre>
Похожие вопросы