Nested Json in Table - React-Virtualized

Question

I'm using Table from 'react-virtualized'.

I receive some nested data that I want to display inside my custom Row. My problem is to bind nested json to my Column dataKey.

    data= 
  {
    name:'Chris',
    age:'15',
    adresse : {
       number:'14',
       street: 'xxx'
               } 
   }

My Column

<Column dataKey="name"    [....] />
<Column dataKey="age" [...] />
<Column dataKey=" ??????" />  // adresse.number ?

Thanks

bvaughn · Accepted Answer · 2017-05-18 17:55:10Z

7

Just supply a cellDataGetter value for the 3rd column.

If you only have the 1 field it could be like:

<Column
  cellDataGetter={({ rowData }) => rowData.address.number}
  dataKey="adresse"
/>

If you want to display more than one it could be more like:

<Column
  cellDataGetter={({ dataKey , rowData }) => rowData.address[dataKey]}
  dataKey="number"
/>
<Column
  cellDataGetter={({ dataKey , rowData }) => rowData.address[dataKey]}
  dataKey="street"
/>

answered May 18, 2017 at 17:55

bvaughn

13.5k49 silver badges46 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Gohmz Over a year ago

I ddin't see cellDataGetter props ! Very usefull. Thanks as always brian !

Collectives™ on Stack Overflow

Nested Json in Table - React-Virtualized

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related