Skip to content

React equivalent to ejs

Im used to do this kind of code using ejs, is there an equivalent way of doing this using react?

What Im trying:
I need to create a new to each aux.Complements elements, the problem is that I cant do {return complement.title} inside html elements

{item.ComplementCategories.map(aux => {
    aux.Complements.map(complement => {
        <tr>
            <td>
                {complement.title}
            </td>
        </tr>
    })
})} 

What I get:
Expected an assignment or function call and instead saw an expression no-unused-expressions

Advertisement

Answer

Based on @DennisVash comment I came up with the following solution

    item.ComplementCategories.map(aux => {
        return aux.Complements.map(complement => {
            return <tr className="tableList--complements">
                <td className="text-left">
                    {complement.title}
                </td>
                <td className="text-center"> - </td>
                <td className="text-right">
                    R$ {complement.price_un}
                </td>
                <td className="text-center">
                    {complement.quantity}X
                </td>
                <td className="text-right">
                    -
                </td>
                <td className="text-right">
                    -
                </td>
            </tr>
        })
    })

Returned a html element and accessing the data through {}
Can also Help

User contributions licensed under: CC BY-SA
9 People found this is helpful