我有以下“cartStore”vue pinia商店：

import { defineStore } from 'pinia'

export const cartStore = defineStore('cart', {
  state: ()=>({
    cart: []
  }),

  actions:{
    async updateQuantity(id,logged,inc){
      console.log("The item id passed is:"+id);
      let user = JSON.parse(localStorage.getItem('user'));
      let product = this.cart.find((item)=>item.item.id=id);
      console.log("the product is:"+JSON.stringify(product));
      console.log("the quantity of the product is:"+product.quantity);

      
      let newQuantity = product.quantity;
      console.log("The previous quantity is:"+newQuantity);
      if(inc) { newQuantity += 1; }
      else { newQuantity -= 1; }

      console.log("The new quantity is:"+newQuantity);
      if(logged){
        await fetch("https://localhost:7113/cart", {
          method: "POST",
          body: JSON.stringify({
            UserId:user.id,
            ItemId:product.item.id,
            Quantity:newQuantity
          }),
          headers: {
            "Content-type": "application/json; charset=UTF-8",
            "Access-Control-Allow-Origin": "*",
          }
        })
      }
      product.quantity = newQuantity;
    }

我有以下vue组件：

<script>
import { defineComponent,computed } from 'vue';

export default defineComponent({
    name:'CartView'
})
</script>

<script setup>
import { cartStore } from '../stores/cart.store';
import { useRouter } from 'vue-router';

const store = cartStore();
const router = useRouter();

const user = JSON.parse(localStorage.getItem('user'));

const isLogged = computed(() => {
  return !(user==null);
})
/*more unimportant code here*/

let updateQuantity= async(id,logged,inc) =>{
    console.log("item id is:"+id);
    console.log("I want to increpement:"+inc);
    await store.updateQuantity(id,logged,inc);
}
</script>
<template>
    <button class="btn btn-outline-secondary" @click="router.push({name:'Catalog'})">Catalog</button>
    <button v-if="isLogged" class="btn btn-outline-secondary" @click="router.push({name:'OrderView'})">Orders</button>
    <div v-if="!store.cart.length" style="text-align: center;">
        <h1>Empty Cart...</h1>
    </div>

    <div class="cart-items" v-else>
        <div class="cart-item"
        v-for="cartItem in store.cart" 
        :key="cartItem.item.id"
        >
        <div class="item-details">
            <span>{{ cartItem }}</span>
            <img :src="cartItem.item.imageFolderPath"/>
            <span>Name: {{ cartItem.item.name }}</span>
            <span>Category: TestCategory</span>
            <span>Price: ${{ cartItem.item.price }}</span>
            <div>
                <span @click="()=>updateQuantity(cartItem.item.id,isLogged,false)">-</span>
                <span>Quantity: {{cartItem.quantity}}</span>
                <span @click="()=>updateQuantity(cartItem.item.id,isLogged,true)">+</span>
            </div>
            <button class="btn btn-outline-danger" @click="removeFromCart(cartItem.item.id,isLogged)">Remove</button>
        </div>
        </div>
        <div class="place-order">
            <button class="btn btn-outline-secondary" @click="placeOrder(store.cart)">Place Order - TODO: STRIPE</button>
        </div>
        
    </div>
</template>

我有3个对象在我的商店.购物车.如果我单击第二个或第三个项目的+/-，它的ID将Map到第一个项目的ID。当到达cartStore中的函数updateQuantity时，ID已经更改，
let product = this.cart.find((item)=>item.item.id=id);
这一行总是返回第一个项目，因为第一个项目和第二个/第三个项目现在有相同的ID。
你知道该怎么解决吗？从我所知道的和读到的一点点，我倾向于与js问题的React/互动。
这里有一个链接与2张图片，之前和之后：https://imgur.com/gallery/025DN4p