Lesson 2.37mIntermediate16.4k students

Generic components in React

A typed list component should tell you what its render callback receives. Generic props are how a reusable component stays specific at each use.

This lesson sits in Generics, part of TypeScript for Application Developers. It assumes what came before it and leads directly into the next lesson in the module.

In this lesson you will

  • Type a component over the shape of its items
  • Keep render props and callbacks correctly typed
  • Forward refs without losing the generic parameter

Pro tip

If a reusable component takes items and hands them back to a callback, it wants a type parameter.

Resources