vue3从Proxy里拿数据

在Vue3中，可以使用`reactive`函数将一个普通对象转换为响应式对象。`reactive`函数内部使用了`Proxy`来实现响应式，因此可以直接从`Proxy`中获取数据。

假设我们有一个响应式对象`user`：

import { reactive } from 'vue'

const user = reactive({
  name: 'John',
  age: 30
})

我们可以使用`Proxy`来获取`user`对象的数据：

const userProxy = new Proxy(user, {
  get(target, key) {
    console.log(`Getting ${key} value: ${target[key]}`)
    return target[key]
  }
})

console.log(userProxy.name) // 输出 "Getting name value: John" 和 "John"
console.log(userProxy.age) // 输出 "Getting age value: 30" 和 "30"

在上面的代码中，我们创建了一个新的`Proxy`对象`userProxy`，并重写了`get`方法。当我们通过`userProxy`对象访问`name`或`age`属性时，`get`方法会被调用，从而可以获取到相应属性的值。