在本機反應中使用循環動態創建單選按鈕

Question

我正在用 React Native 創建一個示例應用程序。 在這個應用程序中，我在一個數組中獲取了 API 數據。 我需要做的是根據數組中的元素數量創建單選按鈕的數量。 所以我使用了從索引位置 0 到數組長度執行的循環，但問題是不是顯示等於數組中元素數的單選按鈕，它只是顯示該特定數組的最后一個元素的單選按鈕。

下面是代碼

    var json_response_SelectSegment = await AuthService.GetSegmentDropdown(this.state.machineId,this.state.orderBySegment,this.state.orderByDescendingSegment,this.state.allRecordsSegment);
    console.log("***got Segment Data*******",json_response_SelectSegment.data.data.segmentMainResponse.segmentResponse)
  var Json_respo_Segment=json_response_SelectSegment.data.data.segmentMainResponse.segmentResponse
  console.log("data = ",Json_respo_Segment.length)
  for(i=0;i<Json_respo_Segment.length;i++){
   console.log("**",Json_respo_Segment[i].Segment)
   console.log("**",Json_respo_Segment[i].SegmentId)
   this.state.radio_props_Segment=[{ label: Json_respo_Segment[i].Segment, value: Json_respo_Segment[i].Segment }]
   console.log("Hello : ",this.state.radio_props_Segment)
   
  }

它顯示了 console.log 中的所有數組元素（例如數組包含 4 個元素），但它只為 UI 中的最后一個元素創建單選按鈕

請問有什么解決辦法嗎？

Answer 1

試試這個方法

 const radioData = [];

  for(i = 0 ; i < Json_respo_Segment.length ; i++){
   
    radioData.push(
        { label: Json_respo_Segment[i].Segment, 
          value: Json_respo_Segment[i].Segment 
        }
     );   
  }

  const data = [...this.state.radio_props_Segment];
  data.push(radioData);
   
  this.setState({radio_props_Segment: data});