反应本机 SectionList 不显示来自 firebase 的数据

Question

我正在获取一个包含两个对象的数组。对象内部有“title”和“iqtiboslar”数组。并在 SectionList 中显示它，但它给出了一个错误：“无法读取未定义的属性（读取'长度'）”。 这是我的代码。任何想法都将受到高度赞赏

const Item = ({iqtiboslar}) => (
  <View>
    <Text>{iqtiboslar}</Text>
  </View>
);
const HomeScreen = ({navigation}) => { const [quote, setQuote] = useState();
useEffect(() => {
    fetchQuotes();
    return () => {
      setQuote();
    };
  }, []);

  const fetchQuotes = async () => {
    try {
      const quoteCollection = await firestore().collection('iqtiboslar').get(); // get(:field) to get specific doc
      quoteCollection._docs.map(doc => setQuote(doc.data().items));
      // quoteCollection._docs.map(doc => console.log(doc));
    } catch (error) {
      console.log(error);
    }
  };


  return (
    <View style={styles.container}>
      {quote ? (
    <SectionList
      sections={quote}
      keyExtractor={(item, index) => item + index}
      renderItem={({item}) => <Item title={item.title} />}
      renderSectionHeader={({section}) => <Text>{section.title}</Text>}
    />
  ) : (
    <ActivityIndicator />
  )}        </View>
  );
};

export default HomeScreen;

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
  },
  text: {
    color: 'red',
  },
});

Answer 1

试试这个代码

<SectionList
          sections={quote}
          keyExtractor={(item, index) => item + index}
          renderItem={({item}) => <Text>{item}</Text>}
          renderSectionHeader={({section: {title}}) => (
            <Text style={styles.text}>{title}</Text>
          )}