我的组件中有一个数组作为状态属性，如下所示：
this.state = { postData: [{id: 1, author: 'Mary'}, {id:2, author: 'John'}] }
当我通过console.log访问它时，例如this.state.postData[0]，它显示对象的内容并正常工作
但是当我尝试将它作为元素的内容输出时，这样：
<p>{this.state.postData[0].author}</p>
它说这this.state.postData[0]是未定义的。到目前为止，我还没有弄清楚为什么会发生这种情况，是否有一些特殊的方法可以在 React 中访问数组？
编辑：附加信息和上下文
状态的初始化：
constructor() {
super();
this.state = { postData: '', end : '' };
this.loadPosts = this.loadPosts.bind(this);
}
我正在加载数据，使用AJAX，jQuery，这是包含post信息的数组结构：（index.js）
app.get('/requestPost/12', (req, res) => {
var jsonPosts = { posts: [ {id:1, author: 'Mary', content: 'Hello, I am Mary'} ] };
res.send(jsonPosts);
});
然后它被接收并且postData状态现在包含该posts数组。
loadPosts() {
$.get('/requestPost/12').success( (data) => {
this.setState({postData : data.posts });
});
}
componentWillMount() {
this.loadPosts();
}
渲染功能。我注意到一种情况，当我this.state.postData[0]在控制台中显示而不尝试将其作为元素输出时，它可以工作。但是，当我尝试将它用作输出时<p>{this.state.postData[0].author}</p>，它也会在控制台中停止工作。此外，当我尝试在控制台中显示 postData 的属性时，它不起作用，例如console.log(this.state.postData[0].author)
render() {
console.log(this.state.postData[0]);
return (
<div>
<h1>This is the blog we all like</h1>
<p>{this.state.postData[0].id}</p>
<p>{this.state.postData[0].author}</p>
<p>{this.state.postData[0].content}</p>
<hr/>
</div>
);
}
谢谢