React render: Objects are not valid as a React child

Question

Please help me. I don\'t know why this piece of code doesn\'t work.

It gives me an error: \"Objects are not valid as a React child (found: object with keys {itemss})

Answer 1

return (
        {items} 
    )

1. In the above line, you render the "items" list. You should render the "item" list which you have create from the map function of the "items" list.

2. And you should be render it into an element.

   class ShopItem extends React.Component {

   render() { var items = [ { link: 'first link', title: 'Emery NEM XF', price: '$950' }, { link: 'second link', title: 'Emery NEM XF', price: '$950' }, { link: 'third link', title: 'Emery NEM XF', price: '$950' } ];

    const item = items.map((i) =>{
   
         return ( 
   {i.title}
    )
   });
   
   return (
       
   
       {item} 
       
   )
   

   } }

ReactDOM.render( , document.querySelector('#root'));