toRefs

把一个reactive对象转换为一个普通对象,并且该普通对象上的每个属性指向的是 ref对象,这些 ref 对象由原对象相应的属性值创建。

不理解?好吧,代码才是最好的解释。

  1. const state = reactive({
  2. foo: 1,
  3. bar: 2
  4. })
  5. const stateAsRefs = toRefs(state)
  6. /*
  7. stateAsRefs 为一个普通对象:
  8. {
  9. foo: Ref<1>,
  10. bar: Ref<2>
  11. }
  12. */
  13. state.foo++
  14. console.log(stateAsRefs.foo.value) // 2
  15. stateAsRefs.foo.value++
  16. console.log(state.foo) // 3

例子中的state 对象和 stateAsRefs 的对象的属性被相互链接在一起了,state 对象里的属性被更改,stateAsRefs 也被更改,反之亦然。

真的挺简单的,难道不是吗?