ReactJS:如何从两个不同选项卡上的表中填充特定数据

Question

我已经创建了一个表，在数据中有名字、姓氏、编号、等级等。我还有一行代码，其中"graduated"：true，"graduated"：false，它没有显示在实际的表中，但在数据中。我试图在一个选项卡上显示所有毕业的人，在另一个选项卡上显示所有没有毕业的人。

我写的标签是：

当我点击Graduated标签和Not Graduated标签下的"graduated"：false时，我如何能够显示带有"graduated"：true的数据呢？

一切都在React JS中。

Answer 1

我认为最好的答案在于Javascript数组方法，而不是react。您应该检查array.filter，然后简单地使用它在JSX中迭代。在示例中，一个选项卡将类似于：

<Tab>
  {fullList.filter(item => item.graduated === true).map(item => {
     ... som edisplay code here
  })}
</Tab>

当然，另一个列表将包含graduated === false。