如何对反应求和

Question

我想将商品加到总计（加价）中。因此，当我单击（添加到购物车）时，它仅添加了一些商品，但我想精确地添加（总和）价格。

    class BookStore extends Component {
        constructor(props){
            super(props);
            this.state = {
                total: 0,
                active: false, 

            }
            this.clicker = this.clicker.bind(this);

        }


    clicker() {
       let active = !this.state.active;
       this.setState({ 
           active: active, 
           total: this.state.total + 1

        })
    };


    render() {
        console.log(this.props.books);
        return (
            <div className='container'>
                <div className='row'>
                <span className='mt-4'>Total: {this.state.total}</span>
                    {this.props.books.map((book, i)=> {

                        return (
                            <>

                            <div className='col-12 card book-card' key={i}>
                                <div className='row'>
                                    <div className='col-8'>
                                        <h5>{book.name}</h5>
                                        <h6>$ {book.price}</h6>
                                    </div>

                                <div className='col-4'>
                                    <button onClick={this.clicker} className=' btn btn-success' style={{width: '50%', }}>add to cart</button>
                                </div>
                                </div>
                            </div>

                            </>
                        )
                    })}

                </div>
            </div>
        )
    }
}

因此，我如何将与相应书有关的总价加在一起。 （我的意思是，当我点击按钮时，我需要在{this state total}字段上显示总计]

我想将商品加到总计（加价）中。因此，当我单击（添加到购物车）时，它仅添加了一些商品，但我想精确地添加（总和）价格。类BookStore扩展了Component {builder（...

Answer 1

我不确定问题是否正确，但是您是否正在尝试将书价传递给clicker函数并将其加到总数中？如果是这样，这样的事情对您有用吗？

Answer 2

不确定我是否理解您的问题，但是下面的代码片段可以正常工作：

Answer 3

在单击器的onClick处理函数中，将价格作为参数。