如何验证jsx模板和标签分数？

Question

我正在尝试在jsx模板中实现if , elif, else，以实现以下数据评分，以及基于评分的标签，但我不确定如何实现。

Low – 0.0 – 3.9
Medium – 4.0 – 6.9
High – 7.0 – 10.0

我有一个包含以下代码的div

{feeds.map(post => 

    <button className="search-buttons detail-button">{post.cvss}</button>
)

Answer 1

在JSX中，我们不能直接使用if/else或像(for，while)这样的循环。然而，我们可以使用的是三元运算符。

语法演示： {isLoggedIn ? 'currently' : 'not'}

使用React官方文档中的此资源可以让您对此进行排序。

Conditional Rendering within JSX

但是，您可以在将JSX返回到代码中的函数中使用if/else。(该案例在链接的文档中也有介绍)