I use ponent in a rendered page. Rendered page have an object array, it's kpi_list[]. I 'do axios get request' in rendering page.

     axios.get(URL + "/KPI/get_by_category/1").then(response=>{
          for (const data in response.data) {
              this.kpi_kalite.push(JSON.parse(JSON.stringify(response.data[data])))
              console.log(Object.values(this.kpi_kalite))
           }  
           .
           .
           .

Output:

(2) [Proxy, Proxy]
      0: Proxy {id: 1, base: 1, name: 'A', searchable_name: 'A', 
         user: '1', …}
      1: Proxy {id: 5, base: 1, name: 'B', searchable_name: 'B', 
         user: '1', …}
    length: 2
    [[Prototype]]: Array(0)

shouldn't I see it like this?

[
   {id: 1, base: 1, name: 'A', searchable_name: 'A', 
     user: '1', …},
   {id: 5, base: 1, name: 'B', searchable_name: 'B', 
     user: '1', …}
]

And whats is [Proxy, proxy]?

I send kpi_kalite array to ponent as a prop. In ponent mounted, I try things like:

  mounted() {
    console.log(this.kpi_kalite[0]) 
    console.log(Object.values(this.kpi_kalite))
},

OUTPUT:

Proxy {id: 1, base: 1, name: 'A', searchable_name: 'A', user: 
       '1', …}
(2) [Proxy, Proxy]

There is a problem, right? These are not the objects or array of objects I need to see.

I use ponent in a rendered page. Rendered page have an object array, it's kpi_list[]. I 'do axios get request' in rendering page.

     axios.get(URL + "/KPI/get_by_category/1").then(response=>{
          for (const data in response.data) {
              this.kpi_kalite.push(JSON.parse(JSON.stringify(response.data[data])))
              console.log(Object.values(this.kpi_kalite))
           }  
           .
           .
           .

Output:

(2) [Proxy, Proxy]
      0: Proxy {id: 1, base: 1, name: 'A', searchable_name: 'A', 
         user: '1', …}
      1: Proxy {id: 5, base: 1, name: 'B', searchable_name: 'B', 
         user: '1', …}
    length: 2
    [[Prototype]]: Array(0)

shouldn't I see it like this?

[
   {id: 1, base: 1, name: 'A', searchable_name: 'A', 
     user: '1', …},
   {id: 5, base: 1, name: 'B', searchable_name: 'B', 
     user: '1', …}
]

And whats is [Proxy, proxy]?

I send kpi_kalite array to ponent as a prop. In ponent mounted, I try things like:

  mounted() {
    console.log(this.kpi_kalite[0]) 
    console.log(Object.values(this.kpi_kalite))
},

OUTPUT:

Proxy {id: 1, base: 1, name: 'A', searchable_name: 'A', user: 
       '1', …}
(2) [Proxy, Proxy]

There is a problem, right? These are not the objects or array of objects I need to see.

• javascript
• vue.js
• axios
• proxy

• Are you using vue 3? – Nima Ebrazeh Commented Sep 16, 2021 at 6:16
• yes @NimaEbrazeh – sssss_sssss Commented Sep 16, 2021 at 6:38
• 1 In addition to @Cosimo Chelini answer, you can read this question which is the answer of you're question. – Nima Ebrazeh Commented Sep 16, 2021 at 7:26
• yeah it's work thank you – sssss_sssss Commented Sep 16, 2021 at 8:00

1 Answer 1

this is normal! vue 3 uses proxies to make the properties you define in the data reactive, consequently going to log the object you see the proxy that contains the true value. to see the true value in console you should do like

console.log(JSON.parse(JSON.stringify(this.yourValue)))

if you want to read more