React Native FlashList：renderItem的Props类型与ListRenderItem属性详解

renderItem的Props类型 #

renderItem函数接收的参数属于ListRenderItemInfo<T>泛型类型，其中T是你列表项对应的数据类型（比如示例中的ICard）。这个类型包含以下核心属性：

• item: T：当前要渲染的列表项数据，示例中就是ICard类型的实例
• index: number：当前项在列表中的索引
• separators：用于自定义分隔符交互的对象，包含highlight、unhighlight、updateProps三个方法，用来处理项的高亮状态或更新分隔符属性

ListRenderItem属性是什么 #

ListRenderItem<T>是FlashList提供的一个泛型类型别名，它定义了列表项渲染函数的标准签名。其本质是一个函数类型，要求：

• 接收一个ListRenderItemInfo<T>类型的参数
• 返回一个React元素（React.ReactElement）或null

你提供的示例代码完全符合这个类型要求：

const renderItem: ListRenderItem<ICard> = ({ item }) => (
  <Card
    {...item}
  />
)

这里通过泛型<ICard>明确了item的类型为ICard，TypeScript会据此做类型校验，避免类型错误。

内容的提问来源于stack exchange，提问作者universe11