显示特定数量的数组对象 (React)

Question

我正在尝试遍历 JSON 数据并仅显示前“4”个结果，但是通过我的所有搜索，我看到的大部分答案都使用循环的 forEach() 或 map()通过所有的数据。我试过使用 for()，但它没有在页面上显示任何内容。如果有人可以帮助我或指导我找到我找不到的答案，那就太好了！

{this.state.products.map(function(product) {
    return(
        <div className="col-xs-12 col-sm-6 col-md-3" key={product.productId}>
            <img src={product.productImage1} Image1 alt="Logo"/>
            <h3>{product.productTitle}</h3>
            <p>{product.productDesc}<a href="/">Learn More</a></p>
        </div>
    );
})}

Answer 1

您可以在map之前使用slice方法。

{this.state.products.slice(0, 4).map(...)}