html - 如何在 React 中执行多个 if else 语句？

Question

所以我正在尝试在 React 中创建一个类似于以下内容的 if else 语句...

(其中 aNumber 是任意数字)

if(aNumber < 5){
    show a picture
}else if (aNumber < 10){
    show a different picture
}else if (aNumber < 15){
    show another different picture
}else{
    show a some other 4th picture
}

在我的表中 this.state.sWA1 返回风速，所以如果它高于某个值我想根据风速的高低显示不同的图片

<td>{this.state.sWA1 > '15' ? <img src={require('../arrowUp.png')} /> : <img src={require('../arrowDown.png')} /> }</td>

这目前有效，但我似乎只能找到一个 if else 语句的帮助，而不是几个 if else 语句，任何人都可以提供帮助或建议替代方法吗？

谢谢!

Answer 1

它叫做 conditional rendering

<div>
  { this.state.sWA1>15 && 
  <div>
    //show picture
  </div>}
  { this.state.sWA1>5 && this.state.sWA1<15
  <div>
    //show picture
  </div>}
</div>