在map函数中反应条件语句

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
))}