我有一个包含许多行的表,我正在向其中传递 Prop 。如果返回的 props 是空字符串 ""我不想渲染该行
<Table.Body>
<Table.Row>
<Table.Cell>Producer</Table.Cell>
<Table.Cell>{props.producer}</Table.Cell>
</Table.Row>
<Table.Row>
<Table.Cell>Country</Table.Cell>
<Table.Cell>{props.country}</Table.Cell>
</Table.Row>
<Table.Row>
<Table.Cell>Region</Table.Cell>
<Table.Cell>{props.region}</Table.Cell>
</Table.Row>
<Table.Row>
<Table.Cell>Subregion</Table.Cell>
<Table.Cell>{props.subregion}</Table.Cell>
</Table.Row>
</Table.Body>
以及它的渲染位置:
render() {
return (
// <Container>
<Grid>
{this.state.wines.length ? (
<List>
{this.state.wines.map(wine => (
<Grid>
<DataWine header={wine.Wine} producer={wine.Producer} country={wine.Country} region={wine.Region} subregion={wine.Subregion}/>
</Grid>
))}
</List>
) : (
<h3>No Results to Display</h3>
)}
因此,在此示例中,如果 JSON 返回 Subregion 的“”,我不希望渲染显示 Subregion:“” 的行。提前致谢!
最佳答案
我不太确定你想要什么。但我很确定你只需要使用 &&
运算符,例如:
{
props.region &&
<Table.Row>
<Table.Cell>Region</Table.Cell>
<Table.Cell>{props.region}</Table.Cell>
</Table.Row>
}
关于javascript - 条件渲染表行 React,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55016071/