i cannot access the value inside a function

Question

Here is my code :

let namesList = ref([]);

const GetFormData = (payload) => {
  return new Promise((resolve, reject) => {
    api
      .get("api.php", { params: { search: payload } })
      .then((response) => {
        data.value = response.data;

        // console.log(data.value);
        // convert array objects to array strings
        namesList = data.value.map(function (list) {
          return list["first_name"];
        });
        // console.log(namesList);
      })
      .catch((error) => {
        reject(error);
      });
  });
};

If I console the namelist inside the function it returns the value :

(9) ['Michael Angelodfsed', 'Mardin', 'Joemar', 'Chirs', 'chan', 'loys', 'Lorena', 'kayabusa', 'kayabusa']
0: "Michael Angelodfsed"
1: "Mardin"
2: "Joemar"
3: "Chirs"
4: "chan"
5: "loys"
6: "Lorena"
7: "kayabusa"
8: "kayabusa"
length: 9
[[Prototype]]: Array(0)

but if I console the variable outside the function it gives me this console.log(nameList);

RefImpl {__v_isShallow: false, dep: undefined, __v_isRef: true, _rawValue: Array(0), _value: Proxy}
dep: Set(1) {ReactiveEffect}
__v_isRef: true
__v_isShallow: false
_rawValue: []
_value: Proxy
[[Handler]]: Object
[[Target]]: Array(0)
[[IsRevoked]]: false
value: (...)
[[Prototype]]: Object

please help me guys. really struggling here. really appreciate your help.

I think you are trying to access the function before the API call ends.. — Deepak, Aug 11 '22 at 02:25
but how can i store the value inside the function to a variable outside the function? thanks -@Deepak — Michael Angelo Corral, Aug 11 '22 at 02:28
You are doing that already. Just console.log the `nameList` outside the function after your API call ends, maybe using a boolean variable.. — Deepak, Aug 11 '22 at 02:31
Does this answer your question? [How do I return the response from an asynchronous call?](https://stackoverflow.com/questions/14220321/how-do-i-return-the-response-from-an-asynchronous-call) — coagmano, Aug 11 '22 at 12:42

score 0 · Answer 1 · answered Aug 11 '22 at 02:27

0

Follow this:

consf nameList = ref([])

console.log(nameList.value) // get value
nameList.value = ["Shin"] // set value

answered Aug 11 '22 at 02:27

Tachibana Shin

2,605
1
5
9

thanks. but not even a function – Michael Angelo Corral Aug 11 '22 at 02:38

score 0 · Answer 2 · answered Aug 11 '22 at 03:12

As @Deepak stated, you are trying to access the variable before the function (the api call) ends. Your namesList is a ref object, so when you log it before it ends, it logs the object.

As your function is calling an api and use a Promise, you can change your function code to this:

const GetFormData = (payload) => {
  return new Promise((resolve, reject) => {
    api
      .get("api.php", { params: { search: payload } })
      .then((response) => {
        data.value = response.data;

        // console.log(data.value);
        // convert array objects to array strings
        namesList = data.value.map(function (list) {
          return list["first_name"];
        });
        // console.log(namesList);
        resolve(namesList);
      })
      .catch((error) => {
        reject(error);
      });
  });
};

GetFormData(payload).then(data => console.log(data))

i cannot access the value inside a function

2 Answers2