TanStack•3mo ago•

3 replies

sad-indigo

Issue with dynamic indexing inside `.select()`

Hey everyone! I’m trying to build a generic hook that selects a single column based on a

columnName

columnName

prop, but I’m hitting a complex index error.

The Goal: Create a reusable hook that takes a

tableName

tableName

and

columnName

columnName

and fetches that specific field for a set of IDs.

The Error:
Inside the

.select()

.select()

block, trying to access

row.data[columnName]

row.data[columnName]

throws:

Type 'C' cannot be used to index type 'RefLeaf<RowData<S, K>> | Ref<RowData<S, K>> ...'

Type 'C' cannot be used to index type 'RefLeaf<RowData<S, K>> | Ref<RowData<S, K>> ...'

Snippet:

.select(({ row }) => ({
  key: row.key,
  // Error happens here 👇
  value: row.data?.[columnName], 
}))

.select(({ row }) => ({
  key: row.key,
  // Error happens here 👇
  value: row.data?.[columnName], 
}))

It seems like the TanStack

row.data

row.data

proxy doesn't like being indexed by a generic type

from my interface. Has anyone found a clean way to handle dynamic column selection in the query builder without resorting to

as any

as any