I'm building a React Native app with TypeScript. renderItem
complains that the destructured item implicitly has an any
type. I googled and found this question and tried to implement what they teach here combined with the types in index.d.ts
of the @types
package for React Native.
export interface Props {
emotions: Emotion[];
}
class EmotionsPicker extends PureComponent<Props> {
keyExtractor = (item, index) => index;
renderItem = ({ item }) => (
<ListItem title={item.name} checkmark={item.checked} />
);
render() {
return (
<FlatList<Emotion>
keyExtractor={this.keyExtractor}
renderItem={this.renderItem}
data={this.props.emotions}
/>
);
}
}
Unfortunately this does not work. How can I give item the type Emotion
?
I know it's an old question but people googling it might still appreciate it.
import { FlatList, ListRenderItem } from 'react-native'
/*
.
.
.
*/
renderItem: ListRenderItem<Emoticon> = ({ item }) => (
<ListItem title={item.name} checkmark={item.checked} />
);