從動態生成的列表中動態選擇元素

Question

我試圖在觸摸事件時從動態生成的元素列表中選擇一個元素。 我正在使用 for 循環生成列表。 在每個元素中，我添加了一個事件偵聽器並將導航堆棧推送到另一個屏幕。 這工作得很好。 然而，與此同時，我嘗試將狀態更新為所選元素。 因為我只想在用戶按下視圖/按鈕后更新狀態，所以我在事件偵聽器中調用該函數。 問題是，狀態總是更新到 for 循環的最后一個索引，我無法訪問每個元素的索引。 有人可以幫我解決這個問題嗎？

const ListRecommendations = [];
for (var i = 0; i < this.Data.length; i++) {
  ListRecommendations.push(
    <View key={i}
      style={styles.Recommendation}

      onStartShouldSetResponder={() => {
        Navigation.push(this.props.componentId, {
          component: {
            name: 'secondScreen',
          }
        });
        this.setState(i);
      }}
      
    >
      <ImageBackground 
        source= {{uri: this.Data[i].FilePath}}
        style={styles.backgroundImage}
      >
        <Text style={styles.Title}>{this.Data[i].Title}</Text>
      </ImageBackground>
    </View>
  )
}

Answer 1

您在循環中使用var ，但您應該知道var聲明不適用於塊作用域，並且i將等於最后一個值

修復它使用let

for(let  I=0; I < 10; I++){
  // ...
}

請閱讀更多https://javascript.info/variables