编辑：

抱歉，代码沙箱现在可以使用，您只需单击其中一项，它将带您进入产品页面 http://codesandbox.io/s/mystifying-roentgen-7mp0t

我正在研究React购物车，并且我尝试根据解释问题后将要呈现的数组来完成以下工作：

1）我正在尝试检查客户端请求的大小是否可用。

2）如果不可用，我想运行一个函数，将：

2A）将所选对象添加到数组。

2B）在随后的每个点击中，我要更新库存以确保它提醒 客户该商品已无库存，我想增加一个新元素 我想一个叫“数量”。

3）这是我当前的尺寸数组：

[ 0: size: 3 stock: 140
_id: "5d903adb01cdab06932b5566"

1: size: 3.5 stock: 130
_id: "5d903adb01cdab06932b5565"

2: size: 4 stock: 10
_id: "5d903adb01cdab06932b5564"

3: {_id: "5d903adb01cdab06932b5563",size: 4.5,stock: 30}

4: size: 5 stock: 53
_id: "5d903adb01cdab06932b5562" ]

4）这些是我正在运行的功能：

  

onClick = {（）=> this.alertBox（prod，arr，item）}

alertBox = (product,products,count) => {
        console.log(count)
        let newStock;
        let clickedSize;
        let selectedProduct;

        if (product.stock === 0) { 
            alert('The item is currently out of stock')
        } else {
            newStock = product.stock -= 1;  
            clickedSize = product.size;
            selectedProduct = product._id;
            let newProducts;
            let quantity = 0;

            products.map((item) => {
                return item._id === product._id ? 
                    newProducts = [...this.state.chosenSize,{...item,...newStock }]
                    : product
            });
            const tester = [];
            const result = [];
            const newSize = [];
            let quantities = [];
            let items;
            let newIt;

            newProducts.forEach(function(el) {
                if (tester.indexOf(el._id) === -1) {
                    tester.push(el._id)
                    result.push(el)
                    items = {...el}
                }
            });

            let newArray = result.map((item,i) => Object.assign({},item,item.stock -= 1));

            this.setState(prevState => ({
                chosenSize: newArray
            }))

        }
    }

和

  

onClick = {（）=> this.onUpdateItem（idx，arr，prod）}

onUpdateItem = (i,product,prod) => { 
       let newProd = product.stock;
           this.setState({
            chosenSize: product.map(el => (el._id === prod._id ? Object.assign({},el,el.stock -= 1) : el))
     }); 

    };

7）我希望对象在每次单击后更新为类似的内容。

  

3：{_ id：“ 5d903adb01cdab06932b5563”，尺寸：4.5，库存：30，数量：   1}

     

到

     

3：{_ id：“ 5d903adb01cdab06932b5563”，尺寸：4.5，库存：29，数量：   2}

     

到

     

3：{_ id：“ 5d903adb01cdab06932b5563”，尺寸：4.5，库存：28，数量：   3}

这是此项目的代码沙箱，尽管由于任何原因它不再渲染我的组件。该代码位于ProductPage文件codesandbox.io/s/mystifying-roentgen-7mp0t中。

任何帮助将不胜感激！