我开始学习ReactJs，并且尝试从假api https://jsonplaceholder.typicode.com/posts/1获取数据并返回标题和正文。不幸的是，浏览器向我返回错误：TypeError：this.state.postsList.map不是函数。
当我不是针对一个帖子而是针对所有帖子标题（https://jsonplaceholder.typicode.com/posts/）的列表进行同样的操作时，以下所有代码都可以正常工作。
class Post extends Component {
state = {
postsList: {},
};
componentDidMount() {
// const postId = this.props.match.params.id
// fetch(`https://jsonplaceholder.typicode.com/posts/${postId}`)
fetch('https://jsonplaceholder.typicode.com/posts/1')
.then(response => response.json())
.then(data => this.setState({
postsList: data,
}));
};
renderList = () => this.state.postsList.map((item, id) => <div>>{item.title}></div>);
render() { return (
this.renderList()
);
}
}
export default Post;
你知道我必须改变吗？
我怀疑问题出在映射上，因为当我获取所有post API时，我返回[]而不是{}，就像这种情况？
最佳答案
class Post extends Component {
state = {
postsList: [],
};
componentDidMount() {
// const postId = this.props.match.params.id
// fetch(`https://jsonplaceholder.typicode.com/posts/${postId}`)
fetch('https://jsonplaceholder.typicode.com/posts')
.then(response => response.json())
.then(data => this.setState({
postsList: [...data],
}));
};
renderList = () => this.state.postsList.map((item, id) => <div>>{item.title}></div>);
render() { return (
this.renderList()
);
}
}
postList应该是Array。您可以使用传播运算符强制执行此操作（但无论索引如何看起来都包含数组）。我还更改了获取以检索/posts索引而不是/posts/:id的方式这里的主要区别是
/posts返回一个post对象的数组关于javascript - TypeError:this.state.postsList.map不是函数，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/58275909/