javascript - 如何在数据中映射数据
问题描述
我通过从 API 获取的数据数组进行映射。我在数据数组中有一个数组(专业)。但未呈现信息。没有错误
const CardItem = ({ data = [] }) => {
console.log(data, 'mapping')
return (
<>
{ data.map(item => {
return (
<Col lg={4} md={6} sm={12} xs={12} key={item.id}>
<Card>
<Card.Img variant="top" src={item.avatar} />
<Card.Body>
<Card.Title>{item.firstName} {item.lastName}</Card.Title>
<Card.Text>
<ul>
{Array.isArray(item.specialty) && item.speciality.length > 0 && item.speciality.map((i) => {
return (
<li>{i}</li>
)
}) : null}
</ul>
</Card.Text>
<Button variant="primary">Go somewhere</Button>
</Card.Body>
</Card>
</Col>
)
})}
</>
)
}
export default CardItem
解决方案
要明确检查类型Array
,您可以检查Array.isArray(var)
{Array.isArray(item.specialty) && item.speciality.length > 0 ? item.speciality.map((i) => {
return (
<li>{i}</li>
)
}) : null}
推荐阅读
- python - acc、loss、val_acc 和 val_loss 在每个 epoch 都相同
- ios - 如何在 Xcode 中使用 iOS 目标?
- sql-server - SQL Server 2016、SSMS 18.3 兼容性和数据库图
- javascript - Angular 8 以(列表详细信息)类型的设置将动态数据传递到激活的路由中
- c - 使用免费功能后数据仍然可用
- extjs - 延迟 Extjs 应用程序加载
- python - 使用 Flask 响应关闭 opencv 流的正确方法
- python-3.x - 将字符串转换为字符串列表
- javascript - 使用 Vue-Moment 时在哪里可以添加“moment.suppressDeprecationWarnings = true”?
- python - 使用 Python 创建动态任务的气流