Local storage, problem z odczytem.

0

Cześć,
tworzę aplikację todo list i od dłuższego czasu męczę się z ty aby, zmusić kod do wyświetlenia w przeglądarce tego co jest zawarte w localstorage. Czytam i oglądam kursy, niestety nie potrafię przełożyć tego na mój kod:

const list = document.querySelector('ul');
list.addEventListener('click', function(ev) {
  if (ev.target.tagName === 'LI') {
    ev.target.classList.toggle('checked');
  }
}, false);
// new item
function myFunction() {
  const li = document.createElement("li");
  const inputValue = document.getElementById("newTask").value;
  const t = document.createTextNode(inputValue);
  li.appendChild(t);
  if (inputValue === '') {
    alert("You must write something!");
  } else {
    document.getElementById("ul").appendChild(li);
  }
  // local storage
  const tasks = localStorage.getItem('todo-task');
    localStorage.setItem('todo-task', inputValue);

  //clear
  document.getElementById("newTask").value = "";

  const closeTask = document.getElementsByClassName("close");
  let i;

  const span = document.createElement("SPAN");
  const txt = document.createTextNode("Delete");
  span.className = "close";
  span.appendChild(txt);
  li.appendChild(span);

  for (i = 0; i < closeTask.length; i++) {
    closeTask[i].onclick = function() {
      let div = this.parentElement;
      div.style.display = "none";
    }
  }
  
}

Z góry dziękuje za pomoc.

2

Nie do końca wiem, co próbujesz tutaj osiągnąć. Wyciągasz informacje z LocalStorage, ale wyciągniętej informacji nigdy nie używasz. Dodatkowo, w kolejnym korku nadpisujesz wcześniej zapisane informacje.

Tak przy okazji, informacje w LocalStorage przechowywane mogą być tylko w postaci ciągu znaków, w związku z tym jak będziesz później zapisywał tablicę/obiekt to będziesz musiał najpierw zamienić tablicę/obiekt na JSON.

0

Przepraszam, rzeczywiście nie napisałem co chcę dokładnie osiągnąć. Chciałbym aby przy każdym nowym uruchomieniu przeglądarki / karty z aplikacją, dane wpisane do todo wyświetlały się, a nie zerowały, z tego co rozumiem, to właśnie muszę w jakiś sposób pobierać je z localstorage i wyświetlić w aplikacji. Z tym mam problem.

1

Zapisywać możesz np. tak:

const todos = [...];
localStorage.setItem('todos', JSON.stringify(todos));

A odczytywać w ten sposób:

const todos = JSON.parse(localStorage.getItem('todos'));
1

Warto dodać, że powinno się odczytywać localstorage w try catch, a to ze względu na fakt, że inna aplikacja może usunąć lub nadpisać to co sam tam zapiszesz.

1 użytkowników online, w tym zalogowanych: 0, gości: 1