CODEWITHSUNDEEP
javascriptreactjsfirebasegoogle-cloud-firestore
Code Eagle
Code Eagle

Reputation: 1222

Unhandled Rejection (TypeError): Cannot read property 'map' of undefined? (React-firebase)

What is wrong in what i am doing, i am getting collection snapshot, looping through it and push it to the state then use that state to render some list items but i get that error: Unhandled Rejection (TypeError): Cannot read property 'map' of undefined

Code:

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

return (
  books.map(return some jsx)
)

Upvotes: 2

Views: 737

Answers (1)

Sam R.
Sam R.

Reputation: 16450

You are doing too many setState. Why not simply do it once?

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>)
)

Upvotes: 1

Related Questions