Don't understand what I'm doing wrong on Use Array.map() to Dynamically Render Elements

Don't understand what I'm doing wrong on Use Array.map() to Dynamically Render Elements
0

#1

Challenge in question:
https://learn.freecodecamp.org/front-end-libraries/react/use-array-map-to-dynamically-render-elements

There’s only two places where you’re supposed to change code. Declaring userInput and toDoList in this.state:

                  this.state={
                    userInput=' ',
                      toDoList=[]
                        }

And defining “items:”

               const items=this.state.toDoList.map((item) => <li key={item}>{item}</li>);

The code isn’t even rendering, when I press “run the tests” I still see “Your test output will go here.” I don’t know what could be so wrong that it’s not executing at all.


#2

Hi,

The problem you are having is not with you map function but in the state that you have declared.

You need to declare objects using colons instead of equals (assignment operator):

this.state = {
  val1: 1,
  val2: "2"
}

I think you might also have a problem with the quote marks you have used but it may just be because I copied and pasted you code. (if you surround you code with three back ticks (`) either side of your code, it will format properly on the forum)

Hope this helps :slight_smile:


#3

D’oh! Thanks, I should’ve caught that.


#4

I’ve edited your post for readability. When you enter a code block into the forum, precede it with a line of three backticks and follow it with a line of three backticks to make easier to read. See this post to find the backtick on your keyboard. The “preformatted text” tool in the editor (</>) will also add backticks around text.