动态映射无线电组出错

Question

我正在尝试从 JSON 文件动态映射无线电组。我已经弄清楚了，但问题是我似乎无法在不出错的情况下为每个收音机添加标签。错误是“）预期的”。我认为这是因为 div 标记在映射之外，但我不确定。这是无线电组的代码

  <div onChange={this.onChangeValue}>          
            {candidateData.map((candidate) => (
                <input type="radio" value={candidate.name} name={candidate.name}/> This is where I want to add the label that throws an error
            ))}
      </div>

这是JSON

{
"candidates":[
            {
              "name":"Uncle Ruckus",
              "politics":"R-District 21",
              "img":"./Candidates/uncleruckus.jpg"
            },
            {
              "name":"Uncle Ruckus",
              "politics":"R-District 21",
              "img":"./Candidates/uncleruckus.jpg"
            }
          ]
}

我希望这是有道理的。我很乐意澄清任何事情。提前致谢。

Answer 1

用反应片段 (<Fragment> </Fragment> ) 或空 (<></>) 标签包装您的输入

 {candidateData.map((candidate) => (
     <>
        <input type="radio" value={candidate.name} name={candidate.name}/> 
        This is where I want to add the label 
     </>
  ))}

动态映射无线电组出错

Error with dynamically mapped radio group

html

javascript

radio-group

reactjs

react-native