Search code examples
firebasefirebase-realtime-databasevuejs2v-for

How to loop over my Firebase snapshot to list using v-for?


I want to filter data from my Firebase database to only list jobs with the authUser equal to the current signed in user.

I have utilized .orderByChild method to filter out the data. However, I cannot figure out why looping into the snapshot to get individual values does not work.

Here is my component where I want to list all jobs that meet this criteria.

Jobs Component code

Also, if I do console.log to preview the data being received, it looks like this. Is this not okay?

Console output

Here is my Firebase data structure. There are no explicit rules defined.

enter image description here

I am fairly new to Vuejs.

After adding self.myJobs = snapshot.val(), my console output looks like this:

updated console output


Solution

  • Can you try something like this ?

    let vm = this //define this variable before the cursor definition
    
    // comment the snapshot.forEach section and replace by
    
    vm.myJobs = snapshot.val() //or any variable containing the jobs