vue3双向绑定实现

const data = new WeakMap();
let activeEffect;
export const setEffect = (fn) => {
  activeEffect = fn;
  fn();
};
const track = (target, key) => {
  if (!activeEffect) return;
  data.get(target) || data.set(target, new Map());
  data.get(target).get(key) || data.get(target).set(key, new Set());
  data.get(target).get(key).add(activeEffect);
  activeEffect = null;
};
const useWatch = (target, key) => {
  data
    ?.get(target)
    ?.get(key)
    .forEach((fn) => fn());
};
export const reactive = (state) => {
  return new Proxy(state, {
    get(target, key) {
      track(target, key);
      return target[key];
    },
    set(target, key, newValue) {
      target[key] = newValue;
      useWatch(target, key);
    },
  });
};