一直收到一个错误：“无法读取空映射的属性”。
一直收到一个错误：“无法读取空映射的属性”。
提问于 2021-12-11 15:19:13
import Post from "./Post"
const PostList = ({posts}) => {
const postComponents = posts.map(post => {
return (
<Post
id = {post.id}
hub_id={post.hub_id}
post_body={post.post_body}
/>
)})
return(
<div className="postList">
{postComponents}
<p>hello world: postList</p>
</div>
)
}
export default PostList;回答 2
Stack Overflow用户
发布于 2021-12-11 15:36:54
尝试使用(props)而不是({post})，然后使用在您的代码中，您的帖子是空的，这意味着您的组件没有从道具获得任何帖子。有时我不知道它是否发生在每个人身上，我的道具没有被正确的破坏，所以我使用了简单的方法。
Stack Overflow用户
发布于 2021-12-11 15:38:26
const postComponents = posts.map(post => {
return (
<Post
id = {post.id}
hub_id={post.hub_id}
post_body={post.post_body}
/>
)})我会把这个postComponents改为这个。
const postComponent = ({posts}) => {
return (
<div>
{posts.map((post) => (
<Post
key={post.id} // need a key when mapping
id = {post.id}
hub_id={post.hub_id}
post_body={post.post_body}
/>
))}
</div>
)
}在映射任何数组时，您需要让它被另一个元素包装，并为每个映射的元素提供一个键。如果postComponent被传递给属性帖子，我就会这样编写它。您所收到的错误可能是因为您不是将帖子发送到postlist组件。posts = null //nothing is in posts。此外，我还会将这个postComponents分解为另一个文件。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/70316392
复制相关文章
相似问题
腾讯云开发者
