Question

我正在用react native创建一个示例应用程序。在此应用程序中，我已在数组中提取了API数据。我需要做的是根据数组中元素的数量创建单选按钮的数量。因此，我使用了 for循环，该循环从索引位置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});

使用React Native中的循环动态创建单选按钮

1 个答案: