react-mdl
react-mdl copied to clipboard
[DataTable] accept nested objects in "rows" array
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.
You can use workaround:
<TableHeader name="profile" cellFormatter={(profile) => profile.name}>Name</TableHeader>