vue3中手写实现shallowRef和ref

最新推荐文章于 2024-05-27 11:31:32 发布

ICPunk

最新推荐文章于 2024-05-27 11:31:32 发布

阅读量129

点赞数 1

分类专栏： vue3 文章标签： javascript 前端开发语言

本文链接：https://blog.csdn.net/xinzaitt/article/details/125565930

版权

vue3 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

// 定义一个shallowRef函数
// 之前都是返回代理对象，这里是返回对象
function shallowRef(target) {
  return {
    // 保存target数据
    _target: target,
    get value() {
      console.log("劫持到了读取数据");
      return this._target;
    },
    set value(val) {
      console.log("劫持到了修改数据", val);
      this._target = val;
    },
  };
}
// 定义一个ref函数, 传入对象的话要通过reactive处理
function ref(target) {
  target = reactive(target);
  return {
    // 保存target数据
    _target: target,
    get value() {
      console.log("劫持到了读取数据");
      return this._target;
    },
    set value(val) {
      console.log("劫持到了修改数据", val);
      this._target = val;
    },
  };
}