React Table Accessor

header: 'Total Price', accessorFn: (row) => row.items.reduce((sum, item) => sum + item.price, 0),

This is the most common method. It allows you to pass a string representing the path to the value. It works similarly to JavaScript's dot notation for object traversal. react table accessor

Direct mapping to flat or nested object properties. header: 'Total Price', accessorFn: (row) => row

In the world of tables—most notably with the industry-standard TanStack Table (formerly React Table) —the accessor is the "bridge" that connects your raw data to a specific column. Direct mapping to flat or nested object properties

Header: "Age Group", accessor: (row) => const age = new Date().getFullYear() - new Date(row.birthDate).getFullYear(); return age < 18 ? "Minor" : "Adult";

const columns = [ Header: "First Name", accessor: "firstName" , // simple property Header: "City", accessor: "address.city" // nested via dot ];