在 Javascript 中通过多个嵌套数组进行交互

问题描述

我有以下响应数据: {name: "some Name",hobbies: Array(13),others: Array(17)}

我想将接收到的数据显示如下:

名称——表示为一个简单的段落。 爱好 - 表示为 名称 下方的 hobbies 手风琴 - 其中每个手风琴的标题是各自的爱好数组条目和正文中的第一个单词是整个数组条目。 其他 - 再次表示为一个简单的段落,其中列出了爱好下方其他数组中的每个值。

我尝试了多种方法来访问元素,但无济于事。到目前为止,我得到了以下结果,但它们与我期望的相差甚远。 请假设结果包含我使用 axios.post 获得的响应并将请求发送到我的 API。

 <div className="searchResults">
                {Object.entries(results).map(([key,value]) =>
                    Object.entries(value).map(([index,value1]) =>
                <p key={index}>
                    {value1}
                </p>
                    ))}
            </div>

解决方法

如果我理解正确,{name: "some Name",hobbies: Array(13),others: Array(17)} 包含对象,例如results

如果是这样,则您错误地迭代了 {Object.keys(results).length && ( <div className="results"> <p>{results.name}</p> <Accordion defaultActiveKey="0" style={{width: '80%'}}> {Object.entries(results.hobbies).map(([key,value]) => <Card key={key}> <Accordion.Toggle as={Card.Header} eventKey="1"> {key} </Accordion.Toggle> <Accordion.Collapse eventKey="1"> <Card.Body> {value} </Card.Body> </Accordion.Collapse> </Card> )} </Accordion> {Object.entries(results.others).map(([key,value]) => <p>{value}</p> )} </div> )}

解决办法是:

MAIN
| --src
     | -- data 
            | -- __init__.py
            | -- operation.py
| tests
          | __init__.py
          | test_file.py
| examples
          | __init__.py
          | example.py