× TypeError: Cannot read property 'bind' of undefined onClick

Question

尝试了多次绑定，但仍然无法使用方法 addItem 将产品添加到购物车， App是我的父类，我试图将prop'addItem'（Type：方法）传递给Products，它将将此方法传递给Product（Products的子级）并最终在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>

我对 React 非常陌生，如果有人能提供帮助，我将不胜感激！标题是错误名称。谢谢！！！

Answer 1

如果没有看到您的 Product 组件，很难判断，但我相信您在对方法的一个引用中缺少对 props 的引用。 我认为应该是

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