×TypeError：无法读取未定义onClick的属性“bind”

Question

尝试多次尝试绑定，但仍然无法使用方法addItem将产品添加到购物车，App是我的父类，我试图将prop“add item”（类型：method）传递给Products，该product将此方法传递给product（产品的子），并最终在product中执行

class App extends Component {
  constructor(props) {
  super(props);
  this.state = {
    cartitems: [],
  }
  this.addItem = this.addItem.bind(this);
}

addItem(item) {
  this.setState({
      cartitems : this.state.cartitems.concat([item]) });
...
 <Route exact path='/Products' component={Products} addItem={this.addItem} />
}

Products是一个类，它从我的数据库中获取数据，并将其传递给Product，如下所示

<div className="row">
    {items.map(item => <Product key={item.id} product={item} addItem={this.addItem} />)}
</div>

<button className="btn btn-primary" onClick= {() => this.props.addItem.bind(this, this.props.product) }>Add to Cart</button>

Answer 1

如果没有看到您的产品组件，很难判断，但我相信您在一个方法引用中缺少了对道具的引用。我相信应该是

   {items.map(item => <Product key={item.id} product={item} addItem={this.props.
addItem} />)}