Javascript 为什么赢了'；我的JSX元素数组是否出现在我的reactjs渲染中？

我正在构建一个小的琐事应用程序，并尝试为每个问题插入一个更新的“选择”元素数组，但是当我尝试插入一个JSX元素数组时，该数组不断显示为空白，我不知道为什么：

let choices = [];

const generateChoices = (answers) => {

        for(let i = 0; i < answers.length; i++){
            choices.push(<ChoiceButton key={answers[i]} value={answers[i]} clicked={(answer) => setSelectedAnswer(decodeURIComponent(answer))}>{answers[i]}</ChoiceButton>);
        };

    };

generateChoices(["One", "Two", "Three", "Four"]);

<BoxWrapper>
...
<Fragment>
     <ChoiceForm>
     {choices}
     <SubmitButton isDisabled={!selectedAnswer} clicked={(e) => {e.preventDefault(); checkAnswer();}}>Submit</SubmitButton>
     </ChoiceForm>
</Fragment>
...
</BoxWrapper>

let choices=[]；
const generateChoices=（答案）=>{
for（设i=0；i{answers[i]}）；
};
};
代词（[“一”、“二”、“三”、“四”）；
...
{选择}
{e.preventDefault（）；checkAnswer（）；}}>提交
...

从ChoiceButton.js：

const ChoiceButton = props => {

    return (<Fragment>
                <ChoiceRadio type="radio" id={props.value} name="choice" onClick={() => props.clicked(props.value)}/>
                <ChoiceLabel htmlFor={props.value} correct={props.correct}>{props.children}</ChoiceLabel>
            </Fragment>
    )
}

const ChoiceButton=props=>{
返回(
props.clicked（props.value）}/>
{props.children}
)
}

---

据我所知，如果我执行

console.log（choices）

，它表明我在其中有4个JSX元素，但是数组在React调试器中显示为空。如何修复此问题？

我认为您需要在阵列中循环。试着做

{choices.map(choice=>choice)}

---

差不多吧。基本上，您应该通过循环数组来逐个渲染它们。

我认为您需要循环数组。试着做

{choices.map(choice=>choice)}

---

差不多吧。基本上，您应该通过循环数组来逐个渲染它们。

您发布的代码没有问题，因为我尝试了它，它工作正常（只是更改HTML标记的自定义组件），您是否可以粘贴

ChoiceButton

组件的代码以查看是否有问题，请？您发布的代码没有问题，因为我尝试了它，它工作正常（只是更改HTML标记的自定义组件），您可以粘贴

ChoiceButton

组件的代码以查看是否有问题吗？