0

I'm running through the starterapp in the GrandStack.IO Grandstack repo

Everything comes up and renders, but I'm getting the warning:

Warning: Each child in a list should have a unique "key" prop.

Check the render method of `RecentReviews`.
    in WithStyles(ForwardRef(TableRow)) (at RecentReviews.js:48)
    in RecentReviews (at Dashboard.js:48)

I've read all I can about this, which essentially means a component which loops should have a unique id. Makes sense. However, the table row on line 48 DOES have a key

   <TableBody>
          {data.Review.map((row) => (         <--this is line 48
            <TableRow key={row.id}>
              <TableCell>{row.date.formatted}</TableCell>
              <TableCell>{row.business.name}</TableCell>
              <TableCell>{row.user.name}</TableCell>
              <TableCell>{row.text}</TableCell>
              <TableCell align="right">{row.stars}</TableCell>
            </TableRow>
          ))}
        </TableBody>

What the heck am I missing?

LarryBud
  • 990
  • 9
  • 20
  • if you comment this code and do a `console.log(data.Review.map((row) => row.id)` you are likely to see some duplicated id number. – buzatto Jan 29 '21 at 18:17
  • Well this is interesting, row.id is undefined. The object doesn't contain that property. Looks like a bug in the starter app? – LarryBud Jan 29 '21 at 19:32
  • depends where `data.Review` comes from, if it is value somewhere gets corrupted along the way... – buzatto Jan 29 '21 at 19:42
  • 1
    Yeah, I'm not sure. This is the stock application, and I'm brand new to react (mvc.net dev here). Thanks for the help. – LarryBud Jan 29 '21 at 19:42

0 Answers0