TypeScript + React Native SectionList

Question

没有与此调用匹配的重载。重载 1 of 2，'(props: Readonly): SectionList'，出现以下错误。属性 'sections' 在类型 '{ children: any[]; 中缺失}' 但在类型 'Readonly<SectionListProps>' 中是必需的。重载 2 of 2，'(props: SectionListProps, context?: any): SectionList'，出现以下错误。属性 'sections' 在类型 '{ children: any[]; 中缺失}' 但在类型 'Readonly<SectionListProps>'.

中是必需的

    <SafeAreaView>
    <SectionList>
      ListHeaderComponent={() => (
        <>
        <BarApresentation bar={bar}/>
        <CategoryList/>
        <HightlightList/>
        </>
      )}
      sections={organizedDishes}
      keyExtractor={(item: { id: number; }) => item.id}
      renderItem={({ item }) => (
        <View>
          <Text>
            {item.name}
          </Text>
        </View>
      )}
      renderSectionHeader={({ sections }) => (
        <Text>{Title}</Text>
      )}
    </SectionList>
    
    </SafeAreaView>```

Answer 1

您传递的道具是 children 而不是 SectionList 的道具。尝试以下操作：

    <SafeAreaView>
    <SectionList
      ListHeaderComponent={() => (
        <>
        <BarApresentation bar={bar}/>
        <CategoryList/>
        <HightlightList/>
        </>
      )}
      sections={organizedDishes}
      keyExtractor={(item: { id: number; }) => item.id}
      renderItem={({ item }) => (
        <View>
          <Text>
            {item.name}
          </Text>
        </View>
      )}
      renderSectionHeader={({ sections }) => (
        <Text>{Title}</Text>
      )}
    />
    
    </SafeAreaView>

TypeScript + React Native SectionList

TypeScript + React Native SectionList

typescript

react-native

react-native-sectionlist