Почему массив в localStorage обнуляется при обновлении страницы?

Question

helpmeplease196 @helpmeplease196

JavaScript

Почему массив в localStorage обнуляется при обновлении страницы?

let arr=[]
localStorage.setItem("arr", JSON.stringify(arr))
let priceArrString = localStorage.getItem("arr")
let priceArr=JSON.parse(priceArrString)

Далее в массив добавляются элементы. Но при обновлении страницы, массив снова равен 0.
В чем здесь ошибка ?

Вопрос задан более двух лет назад
991 просмотр

Комментировать

Подписаться 1 Простой Комментировать

Решения вопроса 2

3 комментария

helpmeplease196 @helpmeplease196 Автор вопроса

Спасибо, но как правильно сделать проверку?
Приходит в голову только такой вариант, но он не работает

let arr
if (localStorage.getItem('arr')== nul){
localStorage.setItem("arr", JSON.stringify(arr))}
let priceArrString = localStorage.getItem("arr")
priceArr=JSON.parse(priceArrString)

То есть - я проверяю, пустой ли сейчас localst и если да, то записываю в него

Написано более двух лет назад
Алексей @Azperin
helpmeplease196,
let priceArr = JSON.parse( localStorage.getItem("arr") ?? '[]');
Написано более двух лет назад
Алексей @Azperin

helpmeplease196, если он пустой, зачем в него записывать ? ты это сделаешь когда с сервера цены получишь

Написано более двух лет назад

7 комментариев

helpmeplease196 @helpmeplease196 Автор вопроса
Простите, понимаю, что это очень простой вопрос, но уже 3 день туплю.
Есть вот такой простой код.
let p = document.querySelector("p") let btn = document.querySelector("button") let k = 0 if(localStorage.getItem("arr")==null /*если arr ничего не хранит*/ ){ localStorage.setItem("arr", JSON.stringify([])/*добавляем в arr пустой массив*/) } else/* если arr уже хранит массив*/{ //то добаляем в него новые значения let arr = JSON.parse(localStorage.getItem("arr")) btn.addEventListener("click", function(){ k++ arr.push(k) p.innerHTML=`${arr}` }) }

Я понимаю, что каждый раз при обновлнии старницы в localStorage попадает пустой массив. Но не один из вариантов проверок не подошел(вернее я не могу их правильно применить). Не могу понять как прописать условия в зависмости от наличия/отсутствия значений.
Написано более двух лет назад
Noder SS @noder_ss

Как я понял, не работает условие. У меня тоже через нулл не работало, проверяйте через пустую строку = ""

Написано более двух лет назад
Noder SS @noder_ss

Применить? А чего нужно добиться?

Написано более двух лет назад
Noder SS @noder_ss

helpmeplease196, не стоит извинятся, я только за помочь. Все через это проходим

Написано более двух лет назад

helpmeplease196 @helpmeplease196 Автор вопроса

Спасибо в итоге работает так:

<body>
    <p></p>
    <button>+</button>
    <div></div>
</body>

let p = document.querySelector('p');
    let btn = document.querySelector('button');

    let body=document.querySelector("body")
let div = document.querySelector("div")
    if (localStorage.getItem('arr') === null) {
        localStorage.setItem('arr', '[]');
    }
    let arrq = JSON.parse(localStorage.getItem('arr'));
    btn.addEventListener('click', function () {
        let k = localStorage.getItem("k")// До этого К не объявлялась. Почему нет ошибки? Ведь изначальное значение не задано (то же самое что: let k; k++ (будет ошибка))
       k++;
        arrq.push(k);
        p.innerHTML=`${arrq}`
        localStorage.setItem('arr', JSON.stringify(arrq));
        localStorage.setItem('k', JSON.stringify(k));

        let newBtn=document.createElement("button")//каждый раз создаем новую кнопку
        div.appendChild(newBtn) // и вставляем в div
    })

Не подскажите можно ли как-то сохранить элемент HTML (div) в localStorage.
Пыталась сделать по аналогии с переменной "к", сохранить div c созданными кнопками но не работает.
Как я поняла разметку тоже можно сохранять в localStorage, или это неверный подход?

Написано более двух лет назад

Noder SS @noder_ss

Попробуйте обращаться по классу или айди, возможно получится, а так без понятия. Это, наверное, уже отдельный вопрос будет). Если интересны все эти сохранения, то попробуйте изучить беккенд по видео из ютуба. Честно, не сильно знаю локалку, если это сохранение DOM, попробуйте, должно работать

Написано более двух лет назад
helpmeplease196 @helpmeplease196 Автор вопроса

Ростик Кальченко, Спасибо

Написано более двух лет назад

Пригласить эксперта

Ответы на вопрос 1

Комментировать

Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы

JavaScript

+2 ещё

Простой
Как сделать плавное появление скрытых под display: none; карточек по клику на кнопку, при подключеной AOS?
- 1 подписчик
- 14 часов назад
- 77 просмотров
1

ответ
JavaScript

+4 ещё

Сложный
Почему в WebSockets History в Burp Suite отображаются кракозябры?
- 1 подписчик
- вчера
- 80 просмотров
2

ответа
JavaScript

Простой
Как выводить JS код?
- 2 подписчика
- вчера
- 1056 просмотров
1

ответ
JavaScript

Простой
Как заставить срабатывать trigger change в Select2?
- 1 подписчик
- вчера
- 52 просмотра
0

ответов
JavaScript

Простой
Почему появляется ошибка Uncaught Reference?
- 1 подписчик
- 20 дек.
- 83 просмотра
2

ответа
JavaScript

Средний
Порождается ли событие в элементе или оно само по себе?
- 1 подписчик
- 20 дек.
- 97 просмотров
1

ответ
JavaScript

+2 ещё

Средний
Как можно изменить настройки модуля навигации карт Google на Яндекс карты?
- 2 подписчика
- 19 дек.
- 209 просмотров
2

ответа
JavaScript

+2 ещё

Простой
Как исправить вёрстку, чтобы блок с изображением не уезжал из-за блока с описанием?
- 1 подписчик
- 19 дек.
- 102 просмотра
0

ответов
JavaScript

+1 ещё

Простой
Как загрузить img в первой очереди при загрузке страницы?
- 1 подписчик
- 19 дек.
- 93 просмотра
1

ответ
JavaScript

+2 ещё

Средний
Какие есть высокоуровневые компонентные javascript фреймворки?
- 1 подписчик
- 19 дек.
- 171 просмотр
1

ответ
Показать ещё Загружается…

JavaScript FullStack разработчик

Rocket • Смоленск

от 80 000 до 130 000 ₽

JavaScript Fullstack

OnClass

от 2 000 до 7 000 $

JavaScript FullStack developer

Wanted. • Санкт-Петербург

До 220 000 ₽

3д сцены

23 дек. 2024, в 04:30

10000 руб./за проект

Разработать телеграм бота с реферальной системой, Юкассой и ChatGPT

23 дек. 2024, в 02:13

20000 руб./за проект

Собрать из исходного кода и запустить в докере рабочее приложение с бд

22 дек. 2024, в 22:57

500 руб./за проект

Answer 1 · 2022-10-15 18:58:15

Дак ты всегда пишеш в локалстор при обновлении
Первое что страница видит это localStorage.setItem("arr", JSON.stringify([]))
ты хоть делай проверку существует ли уже запись в сторе.
Не знаю правда о целесообразности хранения цен в каких-либо кешах, если только они у тебя не меняются месяцами.

Answer 2 · 2022-10-15 20:07:40

Noder SS @noder_ss

Линуксоид-энтузиаст и SQL разработчик

Так вы с каждой перезагрузки сохраняете новую, проверяйте, существует ли она, например, проверка значения

Ответ написан более двух лет назад

7 комментариев

Answer 3 · 2022-10-15 22:42:20

Не надо ничего никуда записывать. Две функции. Одна сохраняет значения, вторая получает.

function setStorageData(key, data) {
  localStorage.setItem(key, JSON.stringify(data));
}

function getStorageData(key, defaultValue = []) {
  return JSON.parse(localStorage.getItem(key)) ?? defaultValue;
}

Вот и всё. Где надо - получаете данные, где надо - сохраняете.

Почему массив в localStorage обнуляется при обновлении страницы?

Войдите, чтобы написать ответ

Минуточку внимания

Войдите на сайт