title: How to fix React "Warning: Each child in a list should have a unique "key" prop"
body: <p>I'm building a React APP to fetch movies and allow to comment them adding also vote/rate. The user can comment and vote for the movie. 
  What I did is to make an <code>option</code> tag and use <code>map</code> to create my rating values a user can choose. </p>
  
  <p>This is a part of the code:</p>
  
  <pre><code>&lt;FormGroup&gt;
    &lt;Label for="rate"&gt;Rate(Out of 5)&lt;/Label&gt;
      &lt;Input
       type="select"
       name="rate"
       value={rate}
       onChange={this.onChange}
       style={{width: 200}}&gt;
       {ratings.map(rating =&gt; (
       // eslint-disable-next-line react/jsx-key
       &lt;option&gt;{rating}&lt;/option&gt;
                ))}
      &lt;/Input&gt;
     &lt;/FormGroup&gt;
  </code></pre>
  
  <p>On the option tag line I'm getting the following error:</p>
  
  <pre><code>Warning: Each child in a list should have a unique "key" prop.
  </code></pre>
  
  <p>I have no idea how to take off of this warning and would like to have some suggestions also why I'm getting this so I can avoid it in the future.</p>
  
  <p>My code fully is here:
  <a href="https://pastebin.com/qvReLYPy" rel="nofollow noreferrer">https://pastebin.com/qvReLYPy</a></p>