Todo app built with vanilla JavaScript

Community feedback

• 

  iliwili•225

  @iliwiliPosted about 3 years ago

  Hey, first of all, I really like how your solution looks and works.

  For the localStorage problem you have. Your code at the moment doesn't let you do what you want because of your render method.

  if (leadsFromLocalStorage) {
    todoLists = leadsFromLocalStorage;
    render(todoLists);
  }
  

  You pass down a list in your method render(lists), but you don't loop through the list in this render method. This method just appends one element in your list-container. That doesn't mean your render method is incorrect, it just means you need to tackle it in a different way.

  1st way

  const renderItem = (value, checked) => {}
  
  if (leadsFromLocalStorage) {
    todoLists = leadsFromLocalStorage;
    todoLists.forEach((todo) => {
      render(todo.value, todo.checked);
    });
  }
  

  Change the render method to something like 'renderItem' and it should have 2 parameters: 'value' and 'checked', then assign the value and checked to the right HTML elements. After that you need to loop through the todoLists list and render each item as shown in the code above.

  2d way

  You change how the 'render' method functions, you get the list as a parameter and re-render the whole list every time something happens. So you clear the container-list div and re-render the whole list.

  I personally would recommend the first way, because it is more efficient and you don't need to change too much functionality.

  Hope this helps! :)

  Marked as helpful

  2

  ---

  

  Zulfa Fatah Akbar Ahmad•175

  @ZulfaabamPosted about 3 years ago

  @iliwili OMG dude, that really does the job. Thank you so much mannn.

  1

  

  iliwili•225

  @iliwiliPosted about 3 years ago

  @Zulfaabam Happy that it helped.

  0