关于onChange与onClick实现购物车修改数量的问题

Question

一个购物车内商品列表，商品A，B，C....
修改A的购买数量，但不点击A的确定按钮，反之点击B的确定按钮，
实际应该是页面刷新后，A和B的购买数量会回到没有修改之前的数量。
因为没有保存A，B的数量也未修改。
onChange 和onClick 改如何实现

                                        {
                                            this.state.list.map((value,key)=>{
                                                return<div key={key}>
                                                     <img width={280} src={value.pic} style = {{float:"left"}}/>
                                                     <div style = {{textAlign:"left"}}>  
                                                        <h1>{value.itemName}</h1> 
                                                            所属：{value.szk}<br/>
                                                            库存：{value.storage}<br/>
                                                            价格：{value.price}元<br/>
                                                            <br/>
                                                            <div>
                                                            购买数量: <input type = "text" defaultValue = {value.count} onChange = {this.handleCount} style = {{width:"50px"}}/>
                                                            &nbsp;&nbsp;&nbsp;<Button  onClick = {()=>this.doChange(value.id,this.state.count,value.storage)} >修改</Button>  &nbsp;&nbsp;&nbsp;
                                                            <Button  onClick = {()=>this.doDelete(value.id)} >删除</Button> 
                                                            </div> 
                                                    </div>
                                                </div>
                                            })
                                        }  

    handleCount=(e)=>{
        this.setState({
            count:e.target.value
        })

    }
    doChange=(id,count,storage)=>{
    this.setState({
        count:null
    })
    const result = /^\d+$/.test(count)
    console.log(id,count,storage)
            if(count!=null){
                if(result){
                    if(eval(storage)>=eval(count)){
                        axios.put("/change",`id=${id}&count=${count}`)
                        .then((res)=>{
                            this.getData()
                            this.forceUpdate()
                        })
                        .catch((error)=>{
                            console.log(error)
                        })


                    }else{
                        alert("库存不够")
                    }
                }else{
                    alert("只能输入数字")
                }
            }else{
                console.log("请输入新的数量")
            }
    }

现在的实际效果是，改完A，点击B的确认，会把A改完后的数量赋值给了B的数量，确认按钮按下后也没有反应修改后的内容。
doChange里传入的是this.state.count的原因导致A的值给了B，所以想知道
handleCount和doChange函数应该怎么写。

最好可以直接给handleCount和doChangede代码

Answer 1

https://blog.csdn.net/zuoyonggang123/article/details/78123495