toRaw & markRow

350 阅读1分钟

toRaw

setup() {
  // 返回 reactive 或 readonly 代理的原始对象。这是一个“逃生舱”,可用于临时读取数据而无需承担代理访问/跟踪的开销,也可用于写入数据而避免触发更改。不建议保留对原始对象的持久引用。请谨慎使用。
  const foo = {};
  const fooReactive = reactive(foo);
  console.log(toRaw(fooReactive) === foo); // true
}

markRaw

setup() {
  // 标记一个对象,使其永远不会转换为 proxy。返回对象本身。
  const foo = markRaw({});
  const fooReactive = reactive(foo);
  console.log(isReactive(fooReactive)); // false

  // 嵌套在其他响应式对象中时也可以使用
  const bar = reactive({ foo });
  console.log(isReactive(bar.foo)); // false
}
setup() {
  // 标记一个对象,使其永远不会转换为 proxy。返回对象本身。
  const foo = markRaw({ baz: {} });
  const fooReactive = reactive(foo);
  console.log(isReactive(fooReactive), 'isReactive(fooReactive)'); // false

  console.log(foo === fooReactive, 'foo === fooReactive'); // true

  // 嵌套在其他响应式对象中时也可以使用
  const bar = reactive({ foo });
  console.log(isReactive(bar.foo), 'isReactive(bar.foo)'); // false

  // 虽然 `foo` 被标记为原始,但 foo.baz 不是。
  const bazReactive = reactive({ baz: foo.baz });
  console.log(bazReactive.baz === foo.baz, 'bazReactive.baz === foo.baz'); // false
  console.log(bar.foo === foo, 'bar.foo === foo'); // true
}

Action!