Error in do map of array inside html in nodejs

Question

everybody i have this peice of code in nodejs

<table class="invoice-items" cellpadding="0" cellspacing="0">
                                        <tbody>
                                       { ${Object.values(services).map((service)=>                                       
                                          <tr key={service.title}>
                                         <td>${service.title}</td>
                                          <td>${service.price}</td>
                                              </tr>
                                        )}}
                                      </tbody>
                                      </table>

and get this error E:\ReactCode\SoapyJoes\soapyjoes_dashboard\functions\index.js:115

 <tr key={service.title}>
                                      ^


[
   { price: '35', quantity: '1', title: 'wash&fold', weight: '2' },
   { price: '10', quantity: '3', title: 'wash', weight: '3' }
 ]

this is services values SyntaxError: Unexpected token '<'

Answer 1

I reproduced your code, made some changes and it was working fine for me after that. I am attaching the screenshot as well as the code for the same.

Code implemented :

import React from "react";
export default function App() {
 
 const services =  { '07b74e70-68a4-4f30-acc4-5543d37572d7': { price: '90', quantity: '4', title: 'fold', weight: '8' } }
 
 console.log(Object.entries(services))
 console.log(Object.values(services))
 
 return (
   <div>
 
   {<table style={{border:"1px solid red"}}>
                                       <tbody >
                                      {Object.values(services).map((service)=>
                                      {console.log(services)
                                        return(
                                         <div>
                                        <tr>
                                         <th> Services </th>
                                         </tr>
                                          <tr key={service.title}>
                                        <td>{service.title}</td>
                            
                                        <td>{service.price}</td>
                                       </tr>
                                       </div>
                                         )}                                     
                                      )}
                                   </tbody>
                                   </table> }                           
   </div>
)}

I hope this works for you.