Quentin_otd
Quentin_otd

Reputation: 233

How to retrieve the value of a get request in Javascript

I'm trying to retrieve data in a javascript object, The object was generated from a get request to an API and the in the network console i can clearly see the response as {"number":"141"} but whenever i try to print the result of the query i get this type of object, which contain the value i want:

In the console :

Object { _c: [], _a: undefined, _s: 0, _d: false, _v: undefined, _h: 0, _n: false }

But when i expend the value

{
  "_c": [],
  "_s": 1,
  "_d": true,
  "_v": {
    "data": {
      "number": "141"
    },
    "status": 200,
    "statusText": "OK",
    "headers": {
      "content-type": "application/json; charset=utf-8"
    },
    "config": {
     [...]
}

But every time i try it appears that i cannot access the value using just tab['_v']. I'v tried multiple things such as :

for (var key in x) {
            console.log(x[key])
        }

to try to print the "_v" part but i'm not enable to list the "_v" part of the array/object.

Steps to obtain such result :

.vue file that call the function

export default {
    mounted() {

    var x=this.connectionsAlive()
    console.log(x)
    for (var property in x) {
        console.log(property)
    }
},
methods: {
        ...mapActions({
            connectionsAlive: 'mkt/connectionsAlive',
        })
    }
}

Then it goes to a file called mkt-module.js and then mkt-api.js

---mkt-module---
import { connectionsAlive } from '@/api/mkt-api'
export default {
    namespaced: true,
    state: {
        test: '',

    },
    actions: {
        connectionsAlive() {
            const response = connectionsAlive()
            return response

        }
    }
}
----mkt-api----
import axios from 'axios'
import { getAbsoluteUrl } from '@/services/url-service'

export const connectionsAlive = () => (
    axios.get(`/api/DeviceEvents/connectionsAlive`)
)

And the response body i get is :

JSON :
number : 141

But when i try to print it i get the result at the top of this post.

I'm clearly missing something or just knowledge about the structure. If anyone has an idea i'll gadly take the help, thanks.

Upvotes: 1

Views: 1022

Answers (1)

tarabor
tarabor

Reputation: 166

As the

connectionsAlive
method does an http calls to the server, it is an asynchronous operation.
You should append a .then() to this.connectionsAlive()

this.connectionsAlive().then(x => {
    console.log(x)
    for (var property in x) {
        console.log(property)
    }
})

I have not tried it, but hope it could help you to spot the problem. You can find further reading about Promises here: https://hackernoon.com/understanding-promises-in-javascript-13d99df067c1

Upvotes: 2

Related Questions