javascript - 当对象已更新时，React 访问对象的属性会返回旧数据

Question

我的组件 props 中有一个对象，我将其称为 data。该对象是动态更新的。然而，当我尝试获取 data 对象的属性时，出现了问题，即使对象已更新，它也会从对象返回旧数据。

例如console.log(data)返回

{
    items: [{name: "NEW NAME"}]
}

但当我尝试直接访问该属性时，情况并非如此，因为 console.log(data.items[0].name) 返回 "OLD NAME" 。 我非常确定组件会更新，因为该对象包含新数据。问题是它呈现旧名称。

另一个细节是它返回以前的名称，例如，如果我传递新数据 console.log(data) 返回

{
    items: [{name: "EVEN NEWER NAME"}]
}

而console.log(data.items[0].name)将返回“NEW NAME”。

如果需要，我很乐意提供更多信息。

Answer 1

每次在浏览器的开发工具中更改对象的值时，都会对对象进行评估。因此，即使 console.log 运行时对象是 {name: "OLD NAME"}，它的值也会稍后更新并显示 {name: "NEW NAME"}

但是当您控制台 data.items[0].name 时，它​​会返回一个字符串“OLD NAME”，并且稍后不会在开发工具中自动评估它。我建议将其呈现在页面上，而不是使用控制台来检查它是否正确更新