Learn localStorage by Building a Todo App - Step 31

JavaScript
1

Tell us what’s happening:

I cannot—for the life of me— get this one to work. All I have to do is create an arrow function and simply select and move existing code (that already passed previous exercises) into it. “Use arrow syntax to create an updateTaskContainer function. Then move the taskData.forEach() and its content into it.”

Your code so far

const updateTaskContainer=()=>{
  taskData.forEach(
      ({ id, title, date, description }) =>
        (tasksContainer.innerHTML += `
        <div class="task" id="${id}">
          <p><strong>Title:</strong> ${title}</p>
          <p><strong>Date:</strong> ${date}</p>
          <p><strong>Description:</strong> ${description}</p>
          <button type="button" class="btn">Edit</button>
          <button type="button" class="btn">Delete</button>
        </div>
      `)
    )
}

Yet I keep getting the following
###Error Message
" You should move taskData.forEach() and its content into the updateTaskContainer() function."

Any ideas? I don’t wanna get all pretentious and be like “Oh it’s probably just a bug, no way MY code is wrong,” but I honestly don’t see what’s wrong with it. Ran it through ChatGPT and it didn’t find any issues either.

2

SOLUTION: So I got it to work by simply adding spaces to the arrow function:
this updateTaskContainer=()=> doesn’t work

but this updateTaskContainer = () => does.

Am I crazy or there’s no reason why the first case shouldn’t work?

1 Like
3

I think it should work but first, can you please provide a link to the exercise you are referring to?

1 Like
4

There is a regex that does not allow for the missing space between the identifier and the assignment operator.

https://github.com/freeCodeCamp/freeCodeCamp/blob/main/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-localstorage-by-building-a-todo-app/64fad9cd2eeb1e7ca2ca8c8b.md

And yes, it should pass without the space.

Edit: I wouldn’t suggest you write your code like that unless you use a code formatter.

PR

1 Like
5

after this worked:
“”
removed
“”"

6

Hello,
How did you all solved the problem? I can’t get past this same problem with previous passing code.

const updateTaskContainer = () => {
    taskData.forEach(({ id, title, date, description }) => {
        tasksContainer.innerHTML += `
            <div class="task" id="${id}">
                <p><strong>Title:</strong> ${title}</p>
                <p><strong>Date:</strong> ${date}</p>
                <p><strong>Description:</strong> ${description}</p>
                <button type="button" class="btn">Edit</button>
                <button type="button" class="btn">Delete</button>
            </div>
        `;
    });
};
7

In the future, please create your own topic when you have specific questions about your own challenge code. Only respond to another thread when you want to provide help to the original poster of the other thread or have follow up questions concerning other replies given to the original poster.

The easiest way to create a topic for help with your own solution is to click the Ask for Help button located on each challenge. This will automatically import your code in a readable format and pull in the challenge url while still allowing you to ask any question about the challenge or your code.

Thank you.

8

It is great that you solved the challenge, but instead of posting your full working solution, it is best to stay focused on answering the original poster’s question(s) and help guide them with hints and suggestions to solve their own issues with the challenge.

We are trying to cut back on the number of spoiler solutions found on the forum and instead focus on helping other campers with their questions and definitely not posting full working solutions.