title: Looping through an array of objects to create radio button options using react/redux
body: <p>I have a react component in which I want to include some radio buttons.</p>
  
  <p>Single.js</p>
  
  <pre><code>class Single extends Component {
  render() {
  
          const {questions, choices, actions} = this.props;
          const {id} = this.props.params;
          const i = questions.findIndex(x =&gt; x.id == id);
          const question_obj = questions[i];
          return ( 
                  &lt;div className = 'QuestionSection'&gt;
                  &lt;h2&gt; Poll Your Choice &lt;/h2&gt; 
                  {question_obj.question_text} 
                  &lt;form ref = 'choiceForm'&gt; 
                  {
                      choices.map((choice, i) =&gt; &lt;Choice {...this.props} key = {i} i = {i} choice = {choice}/&gt;)
                  }
                  &lt;/form&gt; &lt;/div&gt;
                 );
          }
  }
  </code></pre>
  
  <p>Array of choices objects are mapped to a different component Choices.js where each choice is rendered as a radio button.</p>
  
  <p>Since each object is rendered separately, I am not able to handle radio button selection.</p>
  
  <p>How can I loop through this array of choices objects to create radio button with each object and handle selection/submit of radio button options?</p>