Question

React：如何以数据：Array（i）的格式呈现 API 响应数据以响应前端？

2019-06-04

72

javascript reactjs axios

我需要检索 特定作者所著书籍的名称 ，其中 作者姓名 通过 get 请求提供。

我的 API 运行良好并检索相关数据。在这种情况下，我获得了 多本书 的 API 响应 JSON。

API 响应 JSON :

[
    {
        "_id": "5cf40d9d74df260aa460a74b",
        "name": "Oliver Twist",
        "author": "Charles Dickens",
        "yearOfPublication": "1839",
        "__v": 0
    },
    {
        "_id": "5cf4115b4b557126a02c6087",
        "name": "David Copperfield ",
        "author": "Charles Dickens",
        "yearOfPublication": "1850",
        "__v": 0
    },
    {
        "_id": "5cf412c54b557126a02c6088",
        "name": "A Christmas Carol ",
        "author": "Charles Dickens",
        "yearOfPublication": "1843",
        "__v": 0
]

我尝试使用 const books = this.state.data.toString(); 并通过 {books.name 访问书名，但它没有输出书名。但是，当我 console.log() 时， response.data 也成功输出相关数据，如下所示：

0: {_id: "5cf40d9d74df260aa460a74b", name: "Oliver Twist", author: "Charles Dickens", …}
1: {_id: "5cf4115b4b557126a02c6087", name: "David Copperfield ", author: "Charles Dickens", …}
2: {_id: "5cf412c54b557126a02c6088", name: "A Christmas Carol ", author: "Charles Dickens", …}

有人可以建议一种合适的方法来将这些值输出到反应前端吗？提前致谢。

Answer 1

您不需要 .toString()。

由于您有任何数组，因此您需要指定您想要的元素或映射到数组上。

console.log(this.state.data[0].name);

// or to log all names
this.state.data.map(item => console.log(item.name));