How to get original object from Vue 3 proxy?

Question

I want to get original object that was passed to reactive() from Vue 3 proxy. This is my code:

const token: any = reactive(new Token());
console.log(token.target);//prints undefined

Could anyone say how to do it?

Answer 1

reactive returns JavaScript Proxy which doesn't expose original object, unless a proxy is revokable.

Original object can be accessed through __v_raw property on reactive proxy, it's not a part of public API and shouldn't be relied on. Public API is toRaw:

const token = reactive(new Token());
const rawToken = toRaw(token);

If original object is needed then the reference can be kept:

const rawToken = new Token();
const token = reactive(rawToken);

But note this is discouraged in the official documentation:

It is not recommended to hold a persistent reference to the original object. Use with caution.

Reactivity API: Advanced