首页 > 解决方案 > 如何在数据中映射数据

问题描述

我通过从 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

标签: javascriptreactjsapiasynchronous

解决方案


要明确检查类型Array,您可以检查Array.isArray(var)

{Array.isArray(item.specialty) && item.speciality.length > 0 ? item.speciality.map((i) => {
return (
   <li>{i}</li>
)
}) : null}

推荐阅读