reactjs - 从 JSON 响应中获取 react js 中的数组数组

Question

实际上，我正在从 API 获取数据，每件事都运行良好，但是当我获取数组数组时，它会给出未定义的错误......我应该如何解决这个问题。任何帮助将不胜感激......提前谢谢......

这是我从 api 得到的响应..

{data: Array(10), meta: {…}}
data: (10) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}]
meta: {message: "Rider's list fetched successfully.", page: 1, per_page: 10, total: 134}
__proto__: Object

我想获取 total来自' meta '..我已将响应存储在名为 data 的状态中..当我输入 console.log(this.state.data.meta.total)它给了我这样的错误:- Cannot read property 'total' of undefined

Answer 1

Atin Singh 的答案将起作用，尽管它确实需要完整的响应对象。

看看object destructuring只提取你想要的值。
如果您想将它们存储在单个变量中，您需要做的就是将它们添加到一个对象中。但是，当谈到状态时，越平坦越好。

const {data, meta: {total}} = response;
setState({data: {data, total}); 

您现在可以使用 this.state.data.total 访问总数

备注 :您可能希望将状态属性数据的名称更改为其他名称，否则您必须像 this.state.data.data 一样访问它。这很奇怪...

或者将返回的数据数组重命名为比 data 更具描述性的名称.例如，如果它是一群人，您可以执行以下操作:

const {data: people, meta: {total}} = response
setState({data: {people, total});

// this.state.data.people = [{...}, {...}, {...}]
// this.state.data.total = 134 

记住， state updates may be asynchronous ，所以不要只是在设置状态后安慰自己，因为这可能会给你一个误报