2020-01-28 04:15:13 +08:00
|
|
|
import { isObject, toRawType } from '@vue/shared'
|
2019-11-07 01:51:06 +08:00
|
|
|
import {
|
|
|
|
mutableHandlers,
|
|
|
|
readonlyHandlers,
|
2020-04-15 11:49:46 +08:00
|
|
|
shallowReactiveHandlers,
|
|
|
|
shallowReadonlyHandlers
|
2019-11-07 01:51:06 +08:00
|
|
|
} from './baseHandlers'
|
2019-06-12 00:03:50 +08:00
|
|
|
import {
|
|
|
|
mutableCollectionHandlers,
|
2019-08-23 21:38:32 +08:00
|
|
|
readonlyCollectionHandlers
|
2019-06-12 00:03:50 +08:00
|
|
|
} from './collectionHandlers'
|
2020-04-15 10:18:58 +08:00
|
|
|
import { UnwrapRef, Ref } from './ref'
|
2019-10-19 00:11:58 +08:00
|
|
|
import { makeMap } from '@vue/shared'
|
2018-09-19 23:35:38 +08:00
|
|
|
|
|
|
|
// WeakMaps that store {raw <-> observed} pairs.
|
2019-10-06 23:22:32 +08:00
|
|
|
const rawToReactive = new WeakMap<any, any>()
|
|
|
|
const reactiveToRaw = new WeakMap<any, any>()
|
|
|
|
const rawToReadonly = new WeakMap<any, any>()
|
|
|
|
const readonlyToRaw = new WeakMap<any, any>()
|
2018-09-19 23:35:38 +08:00
|
|
|
|
2019-08-23 21:38:32 +08:00
|
|
|
// WeakSets for values that are marked readonly or non-reactive during
|
2018-09-19 23:35:38 +08:00
|
|
|
// observable creation.
|
2020-04-16 04:45:20 +08:00
|
|
|
const rawValues = new WeakSet<any>()
|
2019-06-12 00:03:50 +08:00
|
|
|
|
2019-10-06 23:22:32 +08:00
|
|
|
const collectionTypes = new Set<Function>([Set, Map, WeakMap, WeakSet])
|
2019-10-19 00:11:58 +08:00
|
|
|
const isObservableType = /*#__PURE__*/ makeMap(
|
2019-10-25 23:15:04 +08:00
|
|
|
'Object,Array,Map,Set,WeakMap,WeakSet'
|
2019-10-19 00:11:58 +08:00
|
|
|
)
|
2019-06-12 00:03:50 +08:00
|
|
|
|
|
|
|
const canObserve = (value: any): boolean => {
|
|
|
|
return (
|
|
|
|
!value._isVNode &&
|
2019-10-25 23:15:04 +08:00
|
|
|
isObservableType(toRawType(value)) &&
|
2020-04-16 04:45:20 +08:00
|
|
|
!rawValues.has(value) &&
|
2020-03-23 23:28:20 +08:00
|
|
|
!Object.isFrozen(value)
|
2019-06-12 00:03:50 +08:00
|
|
|
)
|
|
|
|
}
|
|
|
|
|
2019-10-14 23:21:09 +08:00
|
|
|
// only unwrap nested ref
|
|
|
|
type UnwrapNestedRefs<T> = T extends Ref ? T : UnwrapRef<T>
|
|
|
|
|
2019-08-22 00:01:05 +08:00
|
|
|
export function reactive<T extends object>(target: T): UnwrapNestedRefs<T>
|
|
|
|
export function reactive(target: object) {
|
2019-08-23 21:38:32 +08:00
|
|
|
// if trying to observe a readonly proxy, return the readonly version.
|
|
|
|
if (readonlyToRaw.has(target)) {
|
2019-06-12 00:03:50 +08:00
|
|
|
return target
|
|
|
|
}
|
2019-08-20 21:58:10 +08:00
|
|
|
return createReactiveObject(
|
2019-06-12 00:03:50 +08:00
|
|
|
target,
|
2019-08-23 21:38:32 +08:00
|
|
|
rawToReactive,
|
|
|
|
reactiveToRaw,
|
2019-06-12 00:03:50 +08:00
|
|
|
mutableHandlers,
|
|
|
|
mutableCollectionHandlers
|
|
|
|
)
|
2019-08-22 00:01:05 +08:00
|
|
|
}
|
2019-06-12 00:03:50 +08:00
|
|
|
|
2020-04-15 11:49:46 +08:00
|
|
|
// Return a reactive-copy of the original object, where only the root level
|
|
|
|
// properties are reactive, and does NOT unwrap refs nor recursively convert
|
|
|
|
// returned properties.
|
|
|
|
export function shallowReactive<T extends object>(target: T): T {
|
|
|
|
return createReactiveObject(
|
|
|
|
target,
|
|
|
|
rawToReactive,
|
|
|
|
reactiveToRaw,
|
|
|
|
shallowReactiveHandlers,
|
|
|
|
mutableCollectionHandlers
|
|
|
|
)
|
|
|
|
}
|
|
|
|
|
2019-08-23 21:38:32 +08:00
|
|
|
export function readonly<T extends object>(
|
2019-08-22 00:01:05 +08:00
|
|
|
target: T
|
2019-10-10 02:01:53 +08:00
|
|
|
): Readonly<UnwrapNestedRefs<T>> {
|
2019-08-20 21:58:10 +08:00
|
|
|
return createReactiveObject(
|
2019-06-12 00:03:50 +08:00
|
|
|
target,
|
2019-08-23 21:38:32 +08:00
|
|
|
rawToReadonly,
|
|
|
|
readonlyToRaw,
|
|
|
|
readonlyHandlers,
|
|
|
|
readonlyCollectionHandlers
|
2019-06-12 00:03:50 +08:00
|
|
|
)
|
2019-08-22 00:01:05 +08:00
|
|
|
}
|
2019-06-12 00:03:50 +08:00
|
|
|
|
2019-12-03 03:11:12 +08:00
|
|
|
// Return a reactive-copy of the original object, where only the root level
|
2020-01-28 04:15:13 +08:00
|
|
|
// properties are readonly, and does NOT unwrap refs nor recursively convert
|
|
|
|
// returned properties.
|
2019-12-03 03:11:12 +08:00
|
|
|
// This is used for creating the props proxy object for stateful components.
|
|
|
|
export function shallowReadonly<T extends object>(
|
2019-11-07 01:51:06 +08:00
|
|
|
target: T
|
|
|
|
): Readonly<{ [K in keyof T]: UnwrapNestedRefs<T[K]> }> {
|
|
|
|
return createReactiveObject(
|
|
|
|
target,
|
|
|
|
rawToReadonly,
|
|
|
|
readonlyToRaw,
|
2019-12-03 03:11:12 +08:00
|
|
|
shallowReadonlyHandlers,
|
2019-11-07 01:51:06 +08:00
|
|
|
readonlyCollectionHandlers
|
|
|
|
)
|
|
|
|
}
|
|
|
|
|
2019-08-20 21:58:10 +08:00
|
|
|
function createReactiveObject(
|
2019-10-22 23:26:48 +08:00
|
|
|
target: unknown,
|
2019-06-12 00:03:50 +08:00
|
|
|
toProxy: WeakMap<any, any>,
|
|
|
|
toRaw: WeakMap<any, any>,
|
|
|
|
baseHandlers: ProxyHandler<any>,
|
|
|
|
collectionHandlers: ProxyHandler<any>
|
|
|
|
) {
|
|
|
|
if (!isObject(target)) {
|
|
|
|
if (__DEV__) {
|
2019-08-20 21:58:10 +08:00
|
|
|
console.warn(`value cannot be made reactive: ${String(target)}`)
|
2019-06-12 00:03:50 +08:00
|
|
|
}
|
|
|
|
return target
|
|
|
|
}
|
|
|
|
// target already has corresponding Proxy
|
|
|
|
let observed = toProxy.get(target)
|
|
|
|
if (observed !== void 0) {
|
|
|
|
return observed
|
|
|
|
}
|
|
|
|
// target is already a Proxy
|
|
|
|
if (toRaw.has(target)) {
|
|
|
|
return target
|
|
|
|
}
|
|
|
|
// only a whitelist of value types can be observed.
|
|
|
|
if (!canObserve(target)) {
|
|
|
|
return target
|
|
|
|
}
|
2020-01-28 04:15:13 +08:00
|
|
|
const handlers = collectionTypes.has(target.constructor)
|
|
|
|
? collectionHandlers
|
|
|
|
: baseHandlers
|
2019-06-12 00:03:50 +08:00
|
|
|
observed = new Proxy(target, handlers)
|
|
|
|
toProxy.set(target, observed)
|
|
|
|
toRaw.set(observed, target)
|
|
|
|
return observed
|
|
|
|
}
|
|
|
|
|
2019-10-22 23:26:48 +08:00
|
|
|
export function isReactive(value: unknown): boolean {
|
2020-04-16 04:45:20 +08:00
|
|
|
value = readonlyToRaw.get(value) || value
|
|
|
|
return reactiveToRaw.has(value)
|
2019-06-12 00:03:50 +08:00
|
|
|
}
|
|
|
|
|
2019-10-22 23:26:48 +08:00
|
|
|
export function isReadonly(value: unknown): boolean {
|
2019-08-23 21:38:32 +08:00
|
|
|
return readonlyToRaw.has(value)
|
2019-06-12 00:03:50 +08:00
|
|
|
}
|
|
|
|
|
2020-04-16 04:45:20 +08:00
|
|
|
export function isProxy(value: unknown): boolean {
|
|
|
|
return readonlyToRaw.has(value) || reactiveToRaw.has(value)
|
|
|
|
}
|
|
|
|
|
2019-06-12 00:03:50 +08:00
|
|
|
export function toRaw<T>(observed: T): T {
|
2020-04-15 11:49:46 +08:00
|
|
|
observed = readonlyToRaw.get(observed) || observed
|
|
|
|
return reactiveToRaw.get(observed) || observed
|
2019-06-12 00:03:50 +08:00
|
|
|
}
|
|
|
|
|
2020-04-16 04:45:20 +08:00
|
|
|
export function markRaw<T extends object>(value: T): T {
|
|
|
|
rawValues.add(value)
|
2019-06-12 00:03:50 +08:00
|
|
|
return value
|
|
|
|
}
|