CODEWITHSUNDEEP
javascriptreactjstypescriptreact-native
Onyx
Onyx

Reputation: 5782

Generic type 'FlatListProps<ItemT>' requires 1 type argument(s)

I have an article component to which I pass a ListHeaderComponent which is a props of FlatListProps like this:

<Test
    screen={screen}
/>

In Test.tsx I have set the following type:

type Props = {
    screen: ScreenType;
} & Omit<FlatListProps, 'data' | 'renderItem' | 'showsVerticalScrollIndicator'>;

However, I get the following error:

Generic type 'FlatListProps<ItemT>' requires 1 type argument(s).

But I am not quite sure what am I supposed to pass as an argument.

type Props = {
    screen: ScreenType;
} & Omit<FlatListProps<any>, 'data' | 'renderItem' | 'showsVerticalScrollIndicator'>;

This removes the error, however, I start getting the error the item explicitly has any type in the FlatList:

const Test: FunctionComponent<Props> = ({ screen, ...rest }) => {
    return (
        <FlatList
            data={screen.sections}
            renderItem={({ item: section, index }) => {
                return (
                    <Screen isFirst={index === 0}>
                        {screen.items.map((item, idx) => (
                            <Item key={idx} item={item} itemIndex={idx}/>
                        ))}
                    </Section>
                );
            }}
            showsVerticalScrollIndicator={false}
            {...rest}
        />
    );
};

Upvotes: 1

Views: 1331

Answers (1)

Evan Summers
Evan Summers

Reputation: 1212

From looking at the react-native code for FlatList, it seems the ItemT in FlatListProps<ItemT> is the type of the element in the data array. So, in your case it would be the type of an article.sections element, which can be written as ArticleType['sections'][number].

Upvotes: 2

Related Questions