首页 > 解决方案 > 在 React 上更新数组的状态

问题描述

我从 API 获得的响应数据有问题。我使用axios获取JSON对象,每次调用API时都要用对象列表替换状态。

这是代码。

https://i.stack.imgur.com/yHXn0.png

这是控制台

https://i.stack.imgur.com/KnHD2.png

我想我正在错误地更新状态,但我看不到它是什么。

标签: reactjsaxios

解决方案


你的错误信息很清楚。

无法读取未定义的属性“推送”

这意味着什么?这意味着您在一个仍未定义的变量上调用了 push 方法

let paineis = empresas.map( (empresa, i) => {
    paineis.push(<Painel key={i} nome={empresa.nome} usuarios={empresa.usuarios} />)
//  ^-----^
//  this is the issue. paineis has not yet been assigned a value!
})

这里真正的问题是您使用map不正确。映射中的返回值是获取push新值的方式。你想这样做

let paineis = empresas.map( (empresa, i) => <Painel key={i} nome={empresa.nome} usuarios={empresa.usuarios} />)

这是返回的 ES6 简写,也可以写成

let paineis = empresas.map( (empresa, i) => {
  return <Painel key={i} nome={empresa.nome} usuarios={empresa.usuarios} />
})

推荐阅读