vue3 proxy

Vue.js 3 中有一个新的功能叫做 "Proxy"，它可以用于在运行时监视对象的属性访问，从而实现数据响应式。

使用 Proxy 可以方便地实现一些功能，例如观察者模式(observer pattern)、数据校验、日志记录等。

例如，你可以使用 Proxy 实现一个简单的数据绑定：

const data = { name: 'John', age: 30 }
const proxy = new Proxy(data, {
  get(target, key) {
    console.log(`getting ${key}: ${target[key]}`)
    return target[key]
  },
  set(target, key, value) {
    console.log(`setting ${key}: ${value}`)
    target[key] = value
  }
})

proxy.name // getting name: John
proxy.age = 35 // setting age: 35

这样，每当访问或修改 proxy.name 或 proxy.age 时，都会在控制台输出相应的信息。

注意，Proxy 仅能监视对象的属性访问，如果你想监视数组的变化，可以使用另一个新的功能叫做 "Reflect.observe"。