关于vue3的proxy代理的简单实现

let user = {
      name: '张三',
      age: 25,
      wife: {
        name: '丽萨',
        age: 18,
        cars: ['奔驰', '保时捷']
      }
    }


    let proxyUser = new Proxy(user, {
      //获取目标对象的属性值
      get(target, prop) {
        console.log('get方法调用了');
        return Reflect.get(target, prop)
      },
      //修改目标对象的属性值/添加属性也会调用
      set(target, prop, value) {
        console.log('set方法调用了');
        return Reflect.set(target, prop, value)
      },

      //删除属性
      deleteProperty(target, prop) {
        return Reflect.deleteProperty(target, prop)
      }
    })

    console.log(proxyUser.name);


    console.log('+++++++++++++++++');

    proxyUser.name = '刘德华'

    console.log(proxyUser.name);



    //添加属性
    proxyUser.gender = '男'

    console.log(proxyUser);


    //删除属性
    delete proxyUser.wife.name

    console.log(proxyUser.wife.name);

    console.log(user);
  </script>