未处理的拒绝（TypeError）：无法读取未定义的属性“映射”？ （反应火力基地）

Posted 2023-02-22

【中文标题】未处理的拒绝（TypeError）：无法读取未定义的属性“映射”？ （反应火力基地）

【英文标题】：Unhandled Rejection (TypeError): Cannot read property 'map' of undefined? (React-firebase)

【发布时间】：2021-01-12 09:46:57

【问题描述】：

我在做什么有什么问题，我正在获取集合快照，循环通过它并将其推送到状态，然后使用该状态来呈现一些列表项 但我得到那个错误： Unhandled Rejection (TypeError): Cannot read property 'map' of undefined

代码：

const [books, setBooks] = useState([]);
db.collection('books').get()
   .then(snapshot => snapshot.forEach(doc => 
      setBooks([...books, doc.data()])
))

return (
  books.map(return some jsx)
)

【问题讨论】：

你试过这个作为回报books && books.map(return some jsx) 吗？

是的，我试过但没用！ @shubhamjha

也许你可以尝试在 forEach 中使用像 setBooks([]) 这样的空值并记录 doc 和 doc.data()

【参考方案1】：

你做的太多了setState。为什么不干脆做一次呢？

const [books, setBooks] = useState([]);
db.collection('books')
  .get()
  .then(snapshot => snapshot.map(s => s.data())
  .then(data => setBooks(data))
))

return (
  books.map(b => <div>book stuff here</div>)
)

【讨论】：

不幸的是，我得到了那个错误Unhandled Rejection (TypeError): snapshot.map is not a function 促使我使用 forEach 的相同错误

@CodeEagle，这仅意味着您的 db 查询未返回数组。记录 snapshot 变量，看看里面有什么。

@CodeEagle，这可能就是你想要的***.com/a/52101894/1693859

调试它。在then(snapshot => debugger ) 中添加debugger 语句并查看开发工具以了解其中的内容。

终于成功了，谢谢你为我节省了太多的重新渲染！