4

I have have object problem is when I assign object to data property it converts into proxy object .

Here is what I am doing

 data() {
    return {
      msg: "",
      notifications: {},

    };
  },
  this.notifications =  TokenService.getUserInfo().unread_notifications;

Thats how I am receiving object

Proxy {0: {…}, 1: {…}, 2: {…}, 3: {…}, 4: {…}}
[[Handler]]: Object
[[Target]]: Array(5)
[[IsRevoked]]: false

What is the reason?

Improve this question
4
  • 1
    v3.vuejs.org/guide/reactivity.html#proxied-objects. Also related: stackoverflow.com/q/64917686/1048572 Commented Apr 19, 2021 at 17:12
  • "I have have object problem" - why do you have a problem with this, what doesn't work? Just use the proxy the same as you'd have used the object otherwise. Commented Apr 19, 2021 at 17:14
  • i want to use this object in v-for loop but whenever it I get proxy object it for loop done't accept it Commented Apr 19, 2021 at 17:15
  • Describe what "doesn't accept it" means exactly please. Show the code and the error. Commented Apr 19, 2021 at 18:17

1 Answer 1

Reset to default
7

Reason is Vue 3 is using ES6 Proxy to make an objects reactive. You can study how that works in depth or you can just ignore it and work with objects as normal (Proxy is transparent wrapper and works everywhere as your original object)

Improve this answer
Sign up to request clarification or add additional context in comments.

3 Comments

"Proxy is transparent wrapper and works everywhere as your original object" Except when it doesn't. For instance,a Proxy cannot be transferred between threads (i.e. Worker), which can make Vue a pain in the butt.
@Mud Just use toRaw()
TomTom Map requires map instance as raw non proxy object as well.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.