Question

我想在react redux中渲染一个表。更具体地说，我有一个像这样的帐户JSON数组，只有1条记录：

[
{
    "size": "100",
    "date": "6/1/2017",
    "time": "09:23 AM",
    "status": "Working"
  },
{
    "size": "100",
    "date": "6/1/2017",
    "time": "09:23 AM",
    "status": "Completed"
  },
]

我希望呈现状态为已完成的记录。所以当我创建渲染表函数时，我写道：

if ((ordersTrades.map(orderTrade => orderTrade.status)) === 'Completed') {
 return (
   ...
      );
}

但它不会返回任何东西。 ordersTrades是我的JSON的名称。那是为什么？

Answer 1

这样写，首先filter状态为“已完成”的项目，然后使用其中的地图render html：

a = [
{
    "size": "100",
    "date": "6/1/2017",
    "time": "09:23 AM",
    "status": "Working"
  },
{
    "size": "100",
    "date": "6/1/2017",
    "time": "09:23 AM",
    "status": "Completed"
  },
]

b = a.filter(el=> el.status === 'Completed' )

console.log(b); // items that have status Completed

a.filter(el=> el.status === 'Completed' ).map(el=>{console.log('date', el.date) /*return here*/})

Answer 2

首先过滤数组以获取所需的项目，然后像往常一样使用地图进行渲染：

ordersTrades.filter( order => order.status === "Completed" ).map( order => (
  /* render the item */
))

https://jsfiddle.net/1h03gdzy/1/

使用if条件渲染表格

2 个答案: