title: Adding quantity in my reactjs ecommerce website basket
body: <p>I have created my online shoe store website using react. In my cart list I'm trying to increase the quantity of items and along with quantity I'm trying to increase total price too. I tried some ways as of my capabilities but I'm not getting good result.</p>
  <p>In the code below I created a state using useState hook then with two buttons. I'm trying to increase and decrease my state. by that state then I'm trying to increase the quantity of my item then trying to multiply the price with that quantity. it works fine if there is one item in the cart. if there are more than 1 item, the button to increase the quantity of one item showing in my cart, it also increase the quantity of other item too. Thus the price also increase.</p>
  <p><a href="https://i.stack.imgur.com/71dPD.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/71dPD.jpg" alt="enter image description here" /></a></p>
  <pre><code>   &lt;Paper className={classes.total}&gt;
      &lt;h3&gt;Total Items: {itemsInCart.length}&lt;/h3&gt;
      &lt;h3&gt;Total Price: ${total}&lt;/h3&gt;
    &lt;/Paper&gt;
  
    &lt;Container className={classes.root}&gt;
      &lt;Grid container spacing={2} className={classes.container}&gt;
        {itemsInCart.map((shoe) =&gt; (
          &lt;Grid item xs={12} sm={6} md={4} key={shoe.id}&gt;
            &lt;img
              src={shoe.imgurl}
              alt=&quot;&quot;
              height=&quot;200px&quot;
              className={classes.img}
              onClick={() =&gt; {
                navigate(`/products/${shoe.id}`);
              }}
            /&gt;
  
            &lt;Typography variant=&quot;body1&quot;&gt;{shoe.name}&lt;/Typography&gt;
            &lt;Typography variant=&quot;body2&quot;&gt;Price: ${shoe.price}&lt;/Typography&gt;
            &lt;div&gt;
              &lt;span&gt;Quantity&lt;/span&gt;
              &lt;button onClick={() =&gt; setCount(count + 1)}&gt;+&lt;/button&gt;
              {(shoe.qty = count)}
  
              &lt;button
                onClick={() =&gt; {
                  shoe.qty &gt; 1 ? setCount(count - 1) : setCount(1);
                }}
                 &gt;
                -
              &lt;/button&gt;
            &lt;/div&gt;
          &lt;/Grid&gt;
        ))}
      &lt;/Grid&gt;
    &lt;/Container&gt;
  &lt;/&gt;
  </code></pre>
  <p>);
  };`</p>