在映射函數中反應條件語句

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