如何从本地存储中删除空字符串

Question

每次刷新页面时，它都会在我的本地存储中创建空字符串，并且每次都会在我的网络上创建空元素，我不希望我该如何解决这个问题

function saveLocalTodos(todo) {
    //check
    let todos;
    if(localStorage.getItem('todos') === null){
        todos = [];
    }else {
        todos = JSON.parse(localStorage.getItem('todos'))
    }
    

    todos.push(todo);
    localStorage.setItem('todos', JSON.stringify(todos));
}

 window.onload = function() {
        const storedData = localStorage.getItem("todos");
      
       
        if (storedData && storedData !== "") {
          
          let todos;
          if(localStorage.getItem('todos') === null){
              todos = [];
          }else {
              todos = JSON.parse(localStorage.getItem('todos'))
          } else {
          
          localStorage.removeItem('todos')
        };
      }

Answer 1

也许你可以重构为：

const getTodosInStorage = () => {
  const rawTodos = localStorage.getItem('todos');
  const currentTodos = !!rawTodos ? JSON.parse(rawTodos) : [];
  return currentTodos;
};

const saveLocalTodos = (todo) => {
  const currentTodos = getTodosInStorage();
  const todos = JSON.stringify([...currentTodos, todo]);
  localStorage.setItem('todos', todos);
};

window.onload = () => {
  const initialTodos = getTodosInStorage();
  // Do whatever you need to do with the initial
  // already existing todos.
};

这样你就不需要关心

localStorage

项中是否有空字符串。你总会得到你能找到的东西。唯一的事情是你需要确保你会遇到下一个场景：

1. 拨打电话时您会得到

   null

   或

   ''

   localStorage.getItem('todos')

2. 调用时，您将设置一个有效的字符串化 JSON 数组或空字符串

   localStorage.setItem('todos', /*whatever*/)

有了这个，您在

todos

中查找

localStorage

时就会获得一致性。