响应式原理

Vue 3中使用Proxy来劫持属性访问及方法调用

import("./reactivity.esm-browser.js").then((module) => {
  console.log(module);
  const { reactive, ReactiveEffect } = module;
  const obj = reactive({
    a: 1,
    b: 2,
  });
  const effect = new ReactiveEffect(
    () => {
      console.log("effect fn");
      return obj.a + obj.b;
    },
    () => {
      console.log("effect scheduler");
    }
  );
  effect.run();
  obj.a++;
  console.log("a");
});