title: Unable to set property of individual object
body: <p>On using a local variable like I have used, I can set sizeSelect for a product in the mapped list and add another product to cart since sizeSelect changes.I want to give each product in the list a sizeSelect value of its own.</p>
  
  <pre><code>class Men extends React.Component {
  
      render(){
  
          let sizeSelect=null;
  
          return (
              &lt;div&gt; 
              &lt;div className="productGrid"&gt;
              {this.props.products.map((x)=&gt;x.men ? 
              &lt;div&gt;
              {&lt;img src={x.picture.file} alt="Product" style={{width:'250px'}}&gt;&lt;/img&gt;}
              &lt;div&gt;
                  &lt;select onChange={(e)=&gt;{sizeSelect=e.target.value}}&gt;
                      &lt;option&gt;Select&lt;/option&gt;
                      &lt;option&gt; S &lt;/option&gt;
                      &lt;option&gt; M &lt;/option&gt;
                      &lt;option&gt; L &lt;/option&gt;
                      &lt;option&gt; XL &lt;/option&gt;
                  &lt;/select&gt;
              &lt;/div&gt;
              &lt;div&gt;{&lt;button onClick={(e)=&gt;{this.props.addToCart({x})}}&gt;Add To Cart&lt;/button&gt;}
              &lt;/div&gt;
              &lt;/div&gt;:null)}
              &lt;/div&gt;
              &lt;/div&gt;
          )
      }
  }
  
  
  //This is the condition in addToCart function.
  if (product.sizeSelect !== null &amp;&amp; product.sizeSelect !== "Select") {
  ...
  }
  </code></pre>
  
  <p>On giving each product in the list a sizeSelect value of its own, you wont be able to select size of one product and add another product to cart since the sizeSelect property of that product is still null.</p>