Quantcast
Channel: Active questions tagged react-native+typescript - Stack Overflow
Viewing all articles
Browse latest Browse all 6212

React Native SectionList: What are the correct TypeScript types

$
0
0

I'm building a React Native app using TypeScript. I'm trying to use a SectionList. I followed the docs, and here is my code:

  renderSectionHeader = ({ section: { title } }: { section: { title: string } }) => (<ListItem title={title} />  );  render() {    const { sections } = this.props;    return (<SafeAreaView style={styles.container}><SectionList          keyExtractor={this.keyExtractor}          sections={[            {title: 'Title1', data: ['item1', 'item2']},            {title: 'Title2', data: ['item3', 'item4']},            {title: 'Title3', data: ['item5', 'item6']},          ]}          renderItem={this.renderItem}          renderSectionHeader={this.renderSectionHeader}        /></SafeAreaView>    );  }

But the line renderSectionHeader={this.renderSectionHeader} throws the following TSLint Error:

[ts]Type '({ section: { title } }: { section: { title: string; }; }) => Element' is not assignable to type '(info: { section: SectionListData<any>; }) => ReactElement<any> | null'.  Types of parameters '__0' and 'info' are incompatible.    Type '{ section: SectionListData<any>; }' is not assignable to type '{ section: { title: string; }; }'.      Types of property 'section' are incompatible.        Type 'SectionListData<any>' is not assignable to type '{ title: string; }'.          Property 'title' is missing in type 'SectionListData<any>'. [2322]

Are the types of SectionList broken? Or is the example wrong? Or am I doing something wrong?


Viewing all articles
Browse latest Browse all 6212

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>