Question

import React, { Component } from 'react';
import ProductItem from '../components/ProductItem/ProductItem';


class ProductList extends Component {
    constructor(props) {
        super(props)
        this.renderProductItems =this.renderProductItems.bind(this);
        this.handleClick = this.handleClick.bind(this);
    }

    handleClick(product){
        this.props.handleAddToCart(product)
    }
    renderProductItems(product){
        return (
            <div className="col-md-6" key={product.id}>
            <ProductItem>
                product={product}
                handleClick={this.handleClick}
            </ProductItem>
            </div>
        );
    }

  render() {
    return (
      <div>
        {this.props.product.map(this.props.renderProductItems)}
      </div>
    )
  }
}

export default ProductList;

Answer 1

我猜您正在尝试映射数组并将数据传递给方法，您可以使用此方法

./config no-shared no-idea no-mdc2 no-rc5 no-comp enable-tlsext no-ssl2
make depend
Manually replace every occurrence of `gcc`to `afl-gcc` in Makefile 
make && make install

Answer 2

您在地图函数调用中使用了this.props.renderProductItems，这就是问题所在。

该函数不作为道具传递，而是在类内部定义。您应该使用this.renderProductItems访问它。

Answer 3

据我所知renderProductItems不是来自父组件的道具。

所以就像Rahul所说的那样，第一个明显的问题是，您使用this.props.renderProductItems而不是this.renderProductItems的方式就是正确使用this.handleClick的方式。

好运

我想从数据数组中获取数据，并在我的代码.map中彻底执行成功时出错

3 个答案: