react-mdl icon indicating copy to clipboard operation
react-mdl copied to clipboard

[DataTable] accept nested objects in "rows" array

Open sillybutt0 opened this issue 7 years ago • 1 comments

Currently we need to connect data in "rows" prop of DataTable component with TableHeader's "name" prop to work properly. But having nested object in "rows" array will not connect them and sort.

Example of how now works:

const data = [{email: '[email protected]', name: 'Alex'}];

<DataTable rows={data}>
  <TableHeader name="email">Email</TableHeader>
  <TableHeader name="name">Name</TableHeader>
</DataTable>

And how does not work:

const data = [{email: '[email protected]', profile: { name: 'Alex' }}];

<DataTable rows={data}>
  <TableHeader name="email">Email</TableHeader>
  <TableHeader name="name">Name</TableHeader>
</DataTable>

I suggest to type object keys like "profile.name" and make if work correctly with further sorting.

sillybutt0 avatar Aug 30 '17 06:08 sillybutt0

You can use workaround:

<TableHeader name="profile" cellFormatter={(profile) => profile.name}>Name</TableHeader>

vegansk avatar Aug 30 '17 07:08 vegansk