Tengo un componente de artículo al que paso un ListHeaderComponent que es un accesorio de FlatListProps como este:
<Article
article={article}
ListHeaderComponent={<HomeBackgroundImage />}
/>
En Article.tsx he establecido el siguiente tipo:
type Props = {
article: ArticleType;
} & Omit<FlatListProps, 'data' | 'renderItem' | 'showsVerticalScrollIndicator'>;
Sin embargo, me sale el siguiente error:
Generic type 'FlatListProps<ItemT>' requires 1 type argument(s).
Pero no estoy muy seguro de qué se supone que debo pasar como argumento.
type Props = {
article: ArticleType;
} & Omit<FlatListProps<any>, 'data' | 'renderItem' | 'showsVerticalScrollIndicator'>;
Esto elimina el error, sin embargo, empiezo a recibir el error de que el elemento tiene explícitamente cualquier tipo en FlatList:
const Article: FunctionComponent<Props> = ({ article, ...rest }) => {
return (
<FlatList
data={article.sections}
renderItem={({ item: section, index }) => {
const firstCard = section.items.find((item) => {
return item.contentType !== 'heading' && item.contentType !== 'body';
});
const indexOfFirstCard = section.items.indexOf(firstCard!);
const sectionType = firstCard?.contentType;
return (
<Section isFirst={index === 0} sectionType={sectionType}>
{section.items.map((item, idx) => (
<Item key={idx} item={item} itemIndex={idx} indexOfFirstCard={indexOfFirstCard} />
))}
</Section>
);
}}
showsVerticalScrollIndicator={false}
{...rest}
/>
);
};
Al observar el código nativo de reacción para FlatList , parece que ItemT en FlatListProps<ItemT> es el tipo del elemento en la matriz de data . Entonces, en su caso, sería el tipo de un elemento article.sections , que se puede escribir como ArticleType['sections'][number] .