vue3 Proxy

Vue3中的Proxy是一个用于拦截对象操作的特殊对象。它允许您在对象上定义自定义逻辑，并在访问、设置和删除属性时进行拦截。通过使用Proxy，您可以在对象的操作上应用额外的行为或修改对象的默认行为。

Proxy在Vue3中的应用非常广泛，特别是在响应式数据和Vue的Reactivity系统中。它可以用来实现数据的劫持、监听和依赖收集。通过对代理对象进行拦截，Vue能够跟踪对象的变化并在数据发生变化时更新视图。

您可以通过创建一个Proxy来代理一个对象，并使用handler对象定义拦截器函数。这些拦截器函数将在访问、设置和删除对象的属性时被调用。例如，您可以使用get拦截器来拦截对对象属性的访问，并在访问时执行额外的逻辑。

下面是一个示例代码，演示了如何使用Proxy来拦截对象属性的访问：

let user = {
  name: 'John',
  age: 30
};

let userProxy = new Proxy(user, {
  get(target, prop, receiver) {
    console.log(`正在访问属性 ${prop}`);
    return target[prop];
  }
});

console.log(userProxy.name); // 输出 "正在访问属性 name"和 "John"
console.log(userProxy.age); // 输出 "正在访问属性 age"和 30

在这个示例中，通过使用get拦截器，我们可以在访问userProxy对象的属性时打印一条额外的信息。