Javascript 无法在react组件中显示从获取的序列化api中获取的信息

我正在开发一个web应用程序，它基于用户搜索从api获取音乐会。但是，由于我想将不同用户的属性添加并保存到这些音乐会中，因此我决定当用户单击单个音乐会的链接时，它a）保存到数据库中，然后b）呈现该音乐会的单个卡片组件。但是，单个卡中呈现的数据不是来自外部api的数据，而是从我自己的数据库中获取的数据，以填充我的用户输入的额外属性。这本身就已经是一种痛苦。现在-问题是：出于某种原因，每当我尝试显示两层深度的redux状态的数据时，比如说

concerts.attributes.vention

，我会得到一个

类型错误：无法读取未定义的
属性“venture”。我拥有的任何嵌套属性都会发生这种情况。对于更多的上下文，我使用钩子从功能性concert组件中的数据库中获取数据。我还尝试使用生命周期方法将其转换为类组件，但存在相同的问题。我的一部分人认为这是获取的异步性质，在整个序列化数据返回之前进行数据呈现？我不确定。有人知道如何纠正这个问题吗？
请分享代码片段，以便更好地理解。仅仅通过你的语言来可视化代码有点困难

您将从Api获得一些数据作为响应。您需要将该数据存储到某个变量中。有点像这样

JS中的XHR调用并存储对var x的响应

let x;
function successListener() {  
var data = JSON.parse(this.responseText);   //to parse the data to json format
x=data;
}

function failureListener(err) {  
  console.log('Request failed', err);  
}
var request = new XMLHttpRequest();  
request.onload = successListener;  
request.onerror = failureListener;  
request.open('get', 'URL', true);  
request.send();

然后按如下方式访问所需的数据：

x[key][subkey] 

我不知道你在这里干什么

concerts.attributes.venue