Map in JSX - I am confused


#1

Hello everyone i am on lesson 13/16 and do not understand the working of how this map( ) method was used in the example- how does this arrow function work - This is not yet a JSX example --Why then are no quotes placed around the li element ?- console.logging this gives an error --Thank you in advance !

https://www.codecademy.com/courses/react-101/lessons/react-jsx-advanced/exercises/jsx-map?action=lesson_resume


const strings = ['Home', 'Shop', 'About Me'];
const listItems = strings.map(string => <li>{string}</li>);


Below makes sense to me - because an array of strings would appear – however not including quotes as in the example above - does not>:

const strings = ['Home', 'Shop', 'About Me'];

const listItems = strings.map(string => `<li>${string}</li>`);

console.log(listItems);
//output >  [ '<li>Home</li>', '<li>Shop</li>', '<li>About Me</li>' ]

This is a response/answer to a recently closed post
#2

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.