title: map function with select option
body: <p>I have a little problem with using  <code>.map</code>. I have a state like that:</p>
  
  <pre class="lang-js prettyprint-override"><code>getInitialState() {
  return {
    dropdown1: [
      { value: 1, show: '3' },
      { value: 2, show: '6' },
      { value: 3, show: '9' },
      { value: 4, show: '12' },
      { value: 5, show: '15' },
      { value: 6, show: '18' },
      { value: 7, show: '21' },
      { value: 8, show: '24' },
      { value: 9, show: '27' },
      { value: 10, show: '30' },
      { value: 11, show: '33' },
      { value: 12, show: '36' },
      { value: 13, show: '39' },
      { value: 14, show: '42' },
      { value: 15, show: '45' },
      { value: 16, show: '48' },
    ],
    dropdown2: [
      { value: 1, show: '12' },
      { value: 2, show: '24' },
      { value: 3, show: '36' },
      { value: 4, show: '48' },
      { value: 5, show: '60' },
      { value: 6, show: '72' },
      { value: 7, show: '84' },
      { value: 8, show: '96' },
      { value: 9, show: '108' },
      { value: 10, show: '120' },
      { value: 11, show: '132' },
      { value: 12, show: '144' },
      { value: 13, show: '156' },
      { value: 14, show: '168' },
      { value: 15, show: '180' },
      { value: 16, show: '192' },
    ],
    dropdown3: [
      { value: 1, show: '3' },
      { value: 2, show: '6' },
      { value: 3, show: '9' },
      { value: 4, show: '12' },
      { value: 5, show: '15' },
      { value: 6, show: '18' },
      { value: 7, show: '21' },
      { value: 8, show: '24' },
      { value: 9, show: '27' },
      { value: 10, show: '30' },
      { value: 11, show: '33' },
      { value: 12, show: '36' },
      { value: 13, show: '39' },
      { value: 14, show: '42' },
      { value: 15, show: '45' },
      { value: 16, show: 'ellam' },
    ],
    dropdown4: [
      { value: 1, show: '3' },
      { value: 2, show: '6' },
      { value: 3, show: '9' },
      { value: 4, show: '12' },
      { value: 5, show: '15' },
      { value: 6, show: '18' },
      { value: 7, show: '21' },
      { value: 8, show: '24' },
      { value: 9, show: '27' },
      { value: 10, show: '30' },
      { value: 11, show: '33' },
      { value: 12, show: '36' },
      { value: 13, show: '39' },
      { value: 14, show: '42' },
      { value: 15, show: '45' },
      { value: 16, show: '48' },
      { value: 17, show: '60' }
    ]
  }};
  </code></pre>
  
  <p>And after I'm using </p>
  
  <pre class="lang-js prettyprint-override"><code>&lt;Input type="select" name="ccmonth" id="ccmonth" dropdown1={this.state.dropdown1}&gt;
  {
    this.props.dropdown1.map(dropdown =&gt; { 
      return &lt;option dropdown={dropdown} value={dropdown.value}&gt;{dropdown.show}&lt;/option&gt;;
    })
  }
  &lt;/Input&gt;
  </code></pre>
  
  <p>But I'm getting <code>this.props.dropdown1 is undefined</code>. What's going wrong, can you explain me? I watched and tried like in <a href="https://www.youtube.com/watch?v=499IaPWLHKU" rel="nofollow noreferrer">this</a> video.</p>