Accessing data in nested objects

Hi, I have a data array with an object instead of primitive. How can I access this data to display in the table? v8 react-table

const data = [
colName1: {value: 'foo'},
colName2: {value: 'bar'}
]

const data = [
colName1: {value: 'foo'},
colName2: {value: 'bar'}
]

I tried with accessor function

   accessorFn: (originalRow, index) => {
      console.log("originalRow", originalRow);
      console.log("index", index);
    },

   accessorFn: (originalRow, index) => {
      console.log("originalRow", originalRow);
      console.log("index", index);
    },

but originalRow is undefined.

I also tried with

accessorKey

accessorKey

 header: startCase(colName),
 accessorKey: `${colName}.value`,

 header: startCase(colName),
 accessorKey: `${colName}.value`,

but I'm getting this error:

Error: "comments" in deeply nested key "comments.value" returned undefined.

Error: "comments" in deeply nested key "comments.value" returned undefined.

TanStack•4y ago•

1 reply

primary-violet

Hi, I have a data array with an object instead of primitive. How can I access this data to display in the table? v8 react-table

const data = [
colName1: {value: 'foo'},
colName2: {value: 'bar'}
]

const data = [
colName1: {value: 'foo'},
colName2: {value: 'bar'}
]

I tried with accessor function

   accessorFn: (originalRow, index) => {
      console.log("originalRow", originalRow);
      console.log("index", index);
    },

   accessorFn: (originalRow, index) => {
      console.log("originalRow", originalRow);
      console.log("index", index);
    },

but originalRow is undefined.

I also tried with

accessorKey

accessorKey

 header: startCase(colName),
 accessorKey: `${colName}.value`,

 header: startCase(colName),
 accessorKey: `${colName}.value`,

but I'm getting this error:

Error: "comments" in deeply nested key "comments.value" returned undefined.

Error: "comments" in deeply nested key "comments.value" returned undefined.