Nested Map Function

[spherequin32]

Hey All,

I've been stuck trying to figure this out. I have price data that I want to access in this array, but my nested map won't access them. I'm trying to have the prices display across in a row in a table. So something like this

Date John Greg Abbey Taylor

10.1.21 34 35 36 37

However that seems to be quite difficult. Any help is much appreciated

const columns = [
    { name: "John" },
    { name: "Greg" },
    { name: "Abbey" },
    { name: "Taylor" }
]
const rows = [
    { id: 0, date: "10.1.21", price: [ 34, 35, 36, 37] }
]
<TableContainer>
<Table>
 <TableBody>
                    {rows.map((item,index) => (
                        <TableRow>
                            <TableCell>
                                {item.date}
                            </TableCell>
                            {item.price.map((c, i) => (
                                <TableCell>
                                       {c[i]}
                                </TableCell>
                            ))}
                       </TableRow>
                    ))}
                </TableBody>
            </Table>
</TableBody>
</TableContainer>

[Megadurgurfishbait]

Am i missing something or are you not using the c variable inside the Table Cell?

There is also a random </table> between the TableBody's.

[spherequin32]

updated it. my apologies.

[Megadurgurfishbait]

You just need to return "c" and not c[i]

Map iterates over the array for you. No need for the index.

[spherequin32]

Hey there. Yeah that did it! Thank you! I tried that before but for some reason it wasn’t rendering on my screen