Как сохранять разные записи в localstorage?

Question

[Barinn]

Всем привет. Я хочу чтобы при перезагрузке страницы выбранные даты сохранялись.
При клике на дату, у меня делаться запись в localstorage, а при повторном клике она удаляется. Но когда я кликаю на одну дату(добавляется запись в lc), а затем на другую, то новая запись не создаётся, а удаляется предыдущая. Как сделать так, чтобы при клике на разные даты, добавлялись разные записи в lc , а также при повторном клике на эти даты, записи удалялись.

Мой код:
https://codepen.io/mal48813/pen/PrMbYQ

Answer 1

[Дмитрий Арушанов]

Вы же этот вопрос уже вчера задавали?
Вам даже объяснили, что вы пишите
localStorage.setItem('checked','checked')

При клике на любую дату. и это так работать не будет.
У вас используется ОДИН ФЛАГ (checked) - для всех дат?
Вам нужно хранить состояние ДЛЯ КАЖДОЙ ячейки. и Обновлять его.
Так же если у вас 2-3-10 календарей. То вам нужно хрпанить состояние Каждой Ячейки для Каждого Календаря

Comments

[Barinn]

Я попробовал сделать для каждого checkbox'a, но получается километровый код. Как сделать это более компактно я не могу понять.

Answer 2

[nickerlan]

Просто записывайте в localStorage не текущую дату, а массив выбранных дат.

dateClick=(date)=>{
  var dates = localStorage.getItem('datesSelected')
  if (Array.isArray(dates)) 
  {
    if (dates.find(d=>d==date)){
    //Такая дата уже есть, снимаем выбор всех дат
        localStorage.setItem('datesSelected',[])
        draw([]) // обновляем классы отображения
    }
    else{ // если такой даты еще не было добавляем ее в массив
        dates.push(date)
        localStorage.setItem('datesSelected',dates)
        draw(dates) // обновляем классы отображения
        }
    }
    else localStorage.setItem('datesSelected',[date]) //если еще ничего не было задано, задаем одну дату
}