0

Not sure what is happening. I'm making a GET request through axios like this:

    async getUserServers({commit, state, dispatch}, userId){
        try {
            let response = await axios.get("/servers/" + userId)
            console.log(response.data.servers)
            console.log(response.data.servers[0].rooms[0].messages[0].user)
        } catch (error) {
            console.log(error)
        }
    },

As you can see I'm console.log()-ing both:

console.log(response.data.servers)
console.log(response.data.servers[0].rooms[0].messages[0].user)

The second console.log() returns this:

{
  "id": 1,
  "username": "Test",
  "email": "test@abv.bg",
  "image": "test.png",
  "createdAt": "2020-08-12T21:09:58.000Z",
  "updatedAt": "2020-08-12T21:09:58.000Z"
}

But when I console.log(response.data.servers) and navigate to response.data.servers[0].rooms[0].messages[0].user through the console, I can't see a property of messages[0] called user.

Also when I try to render what is inside response.data.servers[0].rooms[0].messages[0].user I get empty div and no errors.

What is interesting is that whenever I refresh the page, I can see the expected contents of response.data.servers[0].rooms[0].messages[0].user being rendered for a millisecond before disappearing. If I keep spamming refresh, I can clearly read everything.

Full code:

    async getUserServers({commit, state, dispatch}, userId){
        try {
            let response = await axios.get("/servers/" + userId)
            let servers = response.data.servers

            commit('setServers', servers) <-- The messages[0].user property disappears because of this
        } catch (error) {
            console.log(error)
        }
    },

Vuex mutation:

    setServers(state, servers){
        state.servers = servers
    },
Onyx
  • 5,186
  • 8
  • 39
  • 86
  • Something is modifying the array after you logged it. – Barmar Sep 01 '20 at 13:24
  • Is there a little blue `i` next to the `response.data.servers` in the log? That indicates it's showing you the value as it is _now_, not what it was when you logged it - the tooltip says something about evaluating expanded properties or somesuch. It seems that you've probably got something else updating this object after you've logged it, but isn't reflected in your code above. – James Thorpe Sep 01 '20 at 13:24
  • Yes, seems like something is indeed modifying the array but I'm not sure why is it happening. All I'm doing is storing the servers into a variable and then committing them to my Vuex store. It seems that if I comment out the Vuex store commit, I see the right array and if I remove the comment, I see the wrong array. I'll add my code to the question. – Onyx Sep 01 '20 at 13:34

0 Answers0