Get nested data from Firestore Database in REACT JS

Question

I'm using reactJS to create a simple social media app. This is the schema of my database:

--- posts (collection)
         |
         --- uid (documents)
              |
              --- userPosts (collection)
                    |
                    --- postId (documents)
                    |     |
                    |     --- title: "Post Title"
                    |     |
                    |     --- date: September 03, 2018 at 6:16:58 PM UTC+3
                    |
                    --- postId (documents)
                          |
                          --- title: "Post Title"

I would like posts to be refreshed in real time with onSnapshot method. How to get ALL of my posts? I changed the structure of my database like you see and I don't know how to get my posts that are nested. This is how I did it before when all of my posts were in "posts" collection.

const [posts,setPosts]= useState([]);

useEffect(() => {
        db.collection('posts').onSnapshot(snapshot =>{
            setPosts(
                snapshot.docs.map(doc=>({
                  id: doc.id,
                  post : doc.data()
                })));
        })
     }, [])

Aayush · Accepted Answer · 2021-01-19 17:03:11Z

1

You can access the nested posts by providing the path to it, like this:

const [posts,setPosts]= useState([]);

useEffect(() => {
        db.collection('posts').onSnapshot(snapshot =>{
           snapshot.docs.map(doc=>({
             doc.collection('userPosts').onSnapshot(snapshot =>{
               setPosts(
                 snapshot.docs.map(doc=>({
                   id: doc.id,
                   post : doc.data()
               })));
             });
           }));
        });
     }, []);

edited Jan 19, 2021 at 17:03

answered Jan 18, 2021 at 17:20

Aayush

1215 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

dodododo97 Over a year ago

But the problem is that it is not a 'uid' but it is a uid of the user. There are many different uids there because every user can post.

Aayush Over a year ago

@dodododo97 If you want ALL Posts of a single user, you can put the uid of the user in place of 'uid'. And If you want ALL Posts of ALL Users, then check the code I've just updated.

Collectives™ on Stack Overflow

Get nested data from Firestore Database in REACT JS

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related