过滤数据之前没有 <Fragment> ReactJS Firebase

Question

你好，我试着过滤我的数据根据他们的状态，问题是，如果我不把一个之前的if，它不想这样做，如果我把一个之前，它只显示我的数据，如果匹配，但仍然显示我的。

{orders
.slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage)
.map((order) => (
<Fragment>{ order.statut === 'Validé' ?  <TableRow key={order.id}>

<TableCell colSpan={12} >
<NavLink  className="NavProjet" to={`./settings/${order.id}`}  replace key={order.id} ><Projetfinis type={order.type} key={order.id}>
<Projetid>#{order.orderid}</Projetid>
<Projettype type={order.type}>{order.type}</Projettype>
<ProjetDate> <Moment format="DD/MM/YYYY">
{order.time}
</Moment></ProjetDate>
<ProjetTitre>{order.nomproduit}</ProjetTitre>
<ProjetStatut statut={order.statut}>{order.statut}</ProjetStatut>
<ProjetIcon><MdAdd/></ProjetIcon>
</Projetfinis></NavLink>

</TableCell>
</TableRow> : null }</Fragment>
))}

如果有人有解决方案，谢谢你的时间。

Answer 1

如果您希望代码在没有<Fragment>的情况下工作，您可以将其更改为:

{
orders
.slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage)
.map(order => {
if (order.statut === "Validé") {
return (
<TableRow key={order.id}>
<TableCell colSpan={12}>
<NavLink
className="NavProjet"
to={`./settings/${order.id}`}
replace
key={order.id}
>
<Projetfinis type={order.type} key={order.id}>
<Projetid>#{order.orderid}</Projetid>
<Projettype type={order.type}>{order.type}</Projettype>
<ProjetDate>
{" "}
<Moment format="DD/MM/YYYY">{order.time}</Moment>
</ProjetDate>
<ProjetTitre>{order.nomproduit}</ProjetTitre>
<ProjetStatut statut={order.statut}>
{order.statut}
</ProjetStatut>
<ProjetIcon>
<MdAdd />
</ProjetIcon>
</Projetfinis>
</NavLink>
</TableCell>
</TableRow>
);
} else {
return null;
}
});
}

但是Fragment有什么问题呢?它不会被渲染到DOM，所以它不应该干扰其他任何东西。