Search code examples
javascriptfirebasevue.jsvuex

How to access items Array of Objects from Firebase


There is probably a similar question like this, but I have been trying to figure it out myself for an hour and tried to look at similar questions. I probably just lack the proper phrase to look up for what I'm experiencing here.

I have a pretty standard firebase / vue.js application, its actually just a training project I am trying to refactor to use Vuex, http vue resource calls and Firebase for practice. Attached is a picture of how my data is stored in firebase.

firebase setup

When I do v-for="stock in getStocks" vue.js is able to iterate through my array just fine. However, when I call my getter and want to just use it in javascript code, I can't actually get at my objects properties. It's like there is a layer between the array and the values.

Attached is how it looks when I do console.log(this.getStocks). getStocks is just a basic vuex getter that returns state.stocks.

console log of getter return

This is probably a simple concept I am just not aware of. Hoping someone can point me in the right direction.

My problem is basically, I can't just do like const stocks = this.getStocks; and then console.log(stocks[0].ticker). Thats where I'm stuck.


Solution

  • I suspect my problem wasn't with the array but with looping through it. It seems to be something to do with trying to do for (var stock in stocks). Doing the plain old for (var i = 0, l = stocks.length; i < l; i++) {... loop style worked.