feat: toRefs

diff --git a/packages/reactivity/src/computed.ts b/packages/reactivity/src/computed.ts
index 9ffbbf0b52b6cbaf4e97ba6cdbc8a9943154c75c..5cbd1b5a2c37b7fa6370f9885be081676ced7871 100644 (file)
--- a/packages/reactivity/src/computed.ts
+++ b/packages/reactivity/src/computed.ts
@@ -1,5 +1,5 @@
 import { effect, ReactiveEffect, activeReactiveEffectStack } from './effect'
-import { UnwrapNestedRefs, knownValues } from './ref'
+import { UnwrapNestedRefs, knownRefs } from './ref'
 
 export interface ComputedRef<T> {
   readonly value: UnwrapNestedRefs<T>
@@ -42,7 +42,7 @@ export function computed<T>(
       }
     }
   }
-  knownValues.add(computedValue)
+  knownRefs.add(computedValue)
   return computedValue
 }
 

diff --git a/packages/reactivity/src/index.ts b/packages/reactivity/src/index.ts
index f790a70a9817bc588805eb474b557a386a313474..99112a94cac1360a74fca782dcc2de01c65cfa66 100644 (file)
--- a/packages/reactivity/src/index.ts
+++ b/packages/reactivity/src/index.ts
@@ -1,4 +1,4 @@
-export { ref, isRef, Ref, UnwrapRef } from './ref'
+export { ref, isRef, toRefs, Ref, UnwrapRef } from './ref'
 export {
   reactive,
   isReactive,

diff --git a/packages/reactivity/src/ref.ts b/packages/reactivity/src/ref.ts
index d2f5a4e455df5e3a68d640fc5e481a360375223b..021fbe09c551b0183f00abd76e5dbbe644c41158 100644 (file)
--- a/packages/reactivity/src/ref.ts
+++ b/packages/reactivity/src/ref.ts
@@ -3,7 +3,7 @@ import { OperationTypes } from './operations'
 import { isObject } from '@vue/shared'
 import { reactive } from './reactive'
 
-export const knownValues = new WeakSet()
+export const knownRefs = new WeakSet()
 
 export interface Ref<T> {
   value: UnwrapNestedRefs<T>
@@ -25,12 +25,38 @@ export function ref<T>(raw: T): Ref<T> {
       trigger(v, OperationTypes.SET, '')
     }
   }
-  knownValues.add(v)
-  return v as any
+  knownRefs.add(v)
+  return v as Ref<T>
 }
 
 export function isRef(v: any): v is Ref<any> {
-  return knownValues.has(v)
+  return knownRefs.has(v)
+}
+
+export function toRefs<T extends object>(
+  object: T
+): { [K in keyof T]: Ref<T[K]> } {
+  const ret: any = {}
+  for (const key in object) {
+    ret[key] = toProxyRef(object, key)
+  }
+  return ret
+}
+
+function toProxyRef<T extends object, K extends keyof T>(
+  object: T,
+  key: K
+): Ref<T[K]> {
+  const v = {
+    get value() {
+      return object[key]
+    },
+    set value(newVal) {
+      object[key] = newVal
+    }
+  }
+  knownRefs.add(v)
+  return v as Ref<T[K]>
 }
 
 type BailTypes =

diff --git a/packages/runtime-core/src/apiInject.ts b/packages/runtime-core/src/apiInject.ts
index c7f8f327e470c0e9896a34bade57c7f11d7834cc..c5f40a7f3e742a779ff6a920202e001ed07f3c59 100644 (file)
--- a/packages/runtime-core/src/apiInject.ts
+++ b/packages/runtime-core/src/apiInject.ts
@@ -1,5 +1,5 @@
 import { currentInstance } from './component'
-import { immutable } from './apiState'
+import { immutable } from './apiReactivity'
 import { isObject } from '@vue/shared'
 
 export interface InjectionKey<T> extends Symbol {}

diff --git a/packages/runtime-core/src/apiState.ts b/packages/runtime-core/src/apiReactivity.ts
similarity index 99%
rename from packages/runtime-core/src/apiState.ts
rename to packages/runtime-core/src/apiReactivity.ts
index f50e14da216ad46c483fa59edef270d07ca92e45..327cc38527aff7d790557b6e350a9a9e70cb40ca 100644 (file)
--- a/packages/runtime-core/src/apiState.ts
+++ b/packages/runtime-core/src/apiReactivity.ts
@@ -1,6 +1,7 @@
 export {
   ref,
   isRef,
+  toRefs,
   reactive,
   isReactive,
   immutable,

diff --git a/packages/runtime-core/src/apiWatch.ts b/packages/runtime-core/src/apiWatch.ts
index 90ebe02a1e29a14da69732da5fd286ebee72be37..1053a67f71e044319e7dfbb8d7d0bb252bae82cd 100644 (file)
--- a/packages/runtime-core/src/apiWatch.ts
+++ b/packages/runtime-core/src/apiWatch.ts
@@ -7,7 +7,7 @@ import {
 } from '@vue/reactivity'
 import { queueJob, queuePostFlushCb } from './scheduler'
 import { EMPTY_OBJ, isObject, isArray, isFunction } from '@vue/shared'
-import { recordEffect } from './apiState'
+import { recordEffect } from './apiReactivity'
 
 export interface WatchOptions {
   lazy?: boolean

diff --git a/packages/runtime-core/src/index.ts b/packages/runtime-core/src/index.ts
index 5fbc426641a5be92d058aff2cf4372a08f70a0b8..ee92001a4ae5a35ab10164a0d043f9ed1ca193a0 100644 (file)
--- a/packages/runtime-core/src/index.ts
+++ b/packages/runtime-core/src/index.ts
@@ -19,7 +19,7 @@ export { createRenderer, RendererOptions } from './createRenderer'
 export { Slot, Slots } from './componentSlots'
 export { PropType, ComponentPropsOptions } from './componentProps'
 
-export * from './apiState'
+export * from './apiReactivity'
 export * from './apiWatch'
 export * from './apiLifecycle'
 export * from './apiInject'