Почему массив в 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.
В чем здесь ошибка ?

Вопрос задан более года назад
734 просмотра

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

Подписаться 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

Простой
Как вывести фотографии из папки или из контейнера последовательно с отработкой на каждой анимации?
- 1 подписчик
- 2 часа назад
- 19 просмотров
1

ответ
JavaScript

Простой
Как проверить три последние цифры числа и по условию изменить их?
- 1 подписчик
- 6 часов назад
- 118 просмотров
2

ответа
JavaScript

Простой
Как правильнее организовать код калькулятора?
- 1 подписчик
- 23 часа назад
- 104 просмотра
1

ответ
JavaScript

+3 ещё

Средний
Как поменять тип проекции карты в Leaflet?
- 3 подписчика
- вчера
- 689 просмотров
1

ответ
JavaScript

+2 ещё

Простой
Добавление определенного класса к header при прокрутке до определенного блока?
- 1 подписчик
- вчера
- 60 просмотров
0

ответов
JavaScript

Простой
Почему не срабатывает prototype reverse на строке?
- 1 подписчик
- вчера
- 57 просмотров
1

ответ
JavaScript

+1 ещё

Простой
Как лучше обратиться к кнопке через id или через class?
- 2 подписчика
- вчера
- 168 просмотров
2

ответа
JavaScript

+2 ещё

Простой
Как сделать ajax фильтрацию по категориям в WP?
- 1 подписчик
- вчера
- 54 просмотра
0

ответов
JavaScript

Средний
Как сделать, чтобы встроенный обработчик события убрал сам себя?
- 3 подписчика
- 01 мая
- 699 просмотров
3

ответа
JavaScript

Простой
Как реализовать карирование так, чтобы оно не было замкнуто на одну переменную?
- 1 подписчик
- 01 мая
- 94 просмотра
0

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

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

SummerWeb • Ярославль

от 100 000 до 140 000 ₽

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

вАйТи

от 5 000 до 25 000 ₽

Middle JavaScript Developer

AppsTrain.io

от 80 000 до 180 000 ₽

Трассровка PCB в Altium Designer

03 мая 2024, в 19:46

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

Laravel + NextJS исправить баги

03 мая 2024, в 18:59

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

VPN Android

03 мая 2024, в 18:52

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

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 обнуляется при обновлении страницы?

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

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

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