vue3 reactive退出响应式？

Question

今天在给reactive对象属性赋值时意识到，要是我将另外一个reactive对象赋予它，那么由于引用类型的缘故它们二者将互相影响

const state = reactive({ count: 0 })
const state1 = reactive({ count:state})

余时乎祭出深拷贝

const state1 = reactive({ count:JSON.parse(JSON.stringify(state))})

虽然问题解决了，但为什么深拷贝能够退出Proxy代理呢

Answer 1

简单说，响应性是因为原始对象被代理(proxy), 对 read 和 write 方法进行了拦截操作， JSON.parse 出来的是一个普通的 js 对象，当然没有的响应性。
另外：vue 提供了一个内置的方法 toRaw() 可以获取原始的没有响应性的对象

Answer 2

toRaw这个看下 api