React foreach in JSX

Question

I have a object that I want to output via REACT

question = {
    text: \"Is this a good question?\",
    answers: [
       \"Yes\",
       \"No\",
       \"I         


        

Answer 1

You need to pass an array of element to jsx. The problem is that forEach does not return anything (i.e it returns undefined). So better use map because it returns an array like this

class QuestionSet extends Component {
render(){ 
    <div className="container">
       <h1>{this.props.question.text}</h1>
       {this.props.question.answers.map((answer, i) => {     
           console.log("Entered");                 
           // Return the element. Also pass key     
           return (<Answer key={i} answer={answer} />) 
        })}
}

export default QuestionSet;