在映射函数中反应条件语句

Question

我正在显示来自 Google Maps API 的评论。 在我的地图功能中，我只想显示评分高于1评论。 如何更新我的地图功能以仅显示review.rating > 1评论？

{this.state.reviews && this.state.reviews.map((review, index) => (
    <div key={index} className="review">
        <p>{review.text}</p>
    </div>
))}

Answer 1

只需在映射之前过滤它们：

{this.state.reviews
    .filter((review) => review.rating > 1) // get only reviews with rating > 1
    .map((review, index) => (
       <div key={index} className="review">
          <p>{review.text}</p>
       </div>
    ))
}

Answer 2

如果由于某种原因您不想在数组上调用.filter方法，您可以执行以下操作。 基本上，您在返回时调用了三元运算符。 如果您需要更多解释，请告诉我。

 {this.state.reviews && this.state.reviews.map((review, index) => ( review.index > 1 ? (<div key={index} className="review"> <p>{review.text}</p> </div>) : null ))}