Как исправить ошибку при рендеринге компонентов в map?

Question

[vladislav3101]

Я написал компоненты для таблицы, и пытаюсь вывести в функций map, но получаю такую ошибку:

Objects are not valid as a React child (found: object with keys {scope, children}). If you meant to render a collection of children, use an array instead.

Код
// Данные: [{id: 1, name: 'Продук-1', price: 2,}, {id: 2, name: 'Продукт-2', price: 3}]

return (
    <Table>
      <TableHead columns={columns} />
      <TableBody>
        {data.map((item) => {
          return (
              <TableRow>
                <TableHeading scope="row">{item.id}</TableHeading>
                <TableCell>{item.name}</TableCell>
                <TableCell>{item.price}</TableCell>
              </TableRow>
          );
        })}
      </TableBody>
    </Table>
  );
};

Answer 1

[vladislav3101]

нашел ошибку, она была совсем не тут. В компоненте TableHeading, я забыл указать деструктуризацию {children}. Простите.