React Native 嵌套平面列表（垂直平面列表中的水平平面列表）

Question

我在垂直平面列表中有一個水平平面列表，我希望根據正在呈現的外部平面列表中的項目提供內部平面列表上的數據

這是我目前擁有的：

 <FlatList style={styles.outerFlatlist} data={this.state.catagories} renderItem={({item, index})=>{ return ( <View> <View> <Text style={styles.catagoryName}> {item.CategoryName} </Text> </View> <View style={styles.innerFlatlist}> <FlatList horizontal={true} data={this.state.product1} renderItem={({item, index})=>{ return ( <View style={styles.productsContainer}> <View style={styles.productImage}> <Image source={{uri:item.productImage}} style={styles.image} resizeMode='contain'> </Image> </View> <View style={styles.productDETAILS}> <Text style={styles.productPrice}>R{item.productPrice} </Text> <Text style={styles.productDescription}> {item.productDecription} </Text> </View> </View> ); }}/> </View> </View> ); }}/>

 <script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>

使用上面的代碼，除了每個類別顯示相同的數據（this.state.product1）之外，一切正常，我怎樣才能使內部平面列表的數據依賴於顯示外部平面列表中的哪個項目？

Answer 1

當您在 .map 內時，您已經在 this.state.catagories 內，但由於您始終將 this.state.product1 用於 flatlist2，因此您將始終獲得相同的結果，因為 this.state.product1保持不變。

在 flatlist2 將數據更改為item.products或item.whateverYouNeedHereButArray

<View style={styles.innerFlatlist}>
      <FlatList
      horizontal={true} 
      data={item}