I’m trying to use the @tanstack/react-table
package correctly with Typescript, but I keep running into a problem that I haven’t been able to solve on my own.
The problem has to do with the accessorKey
property. I keep trying to somehow find a typesafe way to access this property, but have not yet been successful.
I first look for a particular column that has the custom property primary
in it.
const primaryColumn = columns.find((column) => column.meta?.primary === true)
And then I try to access the accessorKey
property on primaryColumn, but every time I do I get a typescript error.
TS2339: Property accessorKey does not exist for type ColumnDef<TData, TValue>.
Property accessorKey does not exist on type
ColumnDefBase<TData, TValue> & StringHeaderIdentifier
Here is my column definition in case it is relevant:
const columns: ColumnDef<Organisation>[] = [
{
meta: {
primary: true
},
accessorKey: "name",
header: ({ column }) => (
<DataTableColumnHeader column={column} title={"Name"} />
),
},
...
]
Has anyone encountered the same problem and knows what to do from here?
If there is any information missing or otherwise, please let me know. I will update the post with the additional information as soon as possible.