144 lines
3.6 KiB
TypeScript
144 lines
3.6 KiB
TypeScript
import { reactive, readonly, toRaw } from './reactive'
|
|
import { OperationTypes } from './operations'
|
|
import { track, trigger } from './effect'
|
|
import { LOCKED } from './lock'
|
|
import { isObject, hasOwn, isSymbol, hasChanged } from '@vue/shared'
|
|
import { isRef } from './ref'
|
|
|
|
const builtInSymbols = new Set(
|
|
Object.getOwnPropertyNames(Symbol)
|
|
.map(key => (Symbol as any)[key])
|
|
.filter(isSymbol)
|
|
)
|
|
|
|
function createGetter(isReadonly: boolean) {
|
|
return function get(target: object, key: string | symbol, receiver: object) {
|
|
const res = Reflect.get(target, key, receiver)
|
|
if (isSymbol(key) && builtInSymbols.has(key)) {
|
|
return res
|
|
}
|
|
if (isRef(res)) {
|
|
return res.value
|
|
}
|
|
track(target, OperationTypes.GET, key)
|
|
return isObject(res)
|
|
? isReadonly
|
|
? // need to lazy access readonly and reactive here to avoid
|
|
// circular dependency
|
|
readonly(res)
|
|
: reactive(res)
|
|
: res
|
|
}
|
|
}
|
|
|
|
function set(
|
|
target: object,
|
|
key: string | symbol,
|
|
value: unknown,
|
|
receiver: object
|
|
): boolean {
|
|
value = toRaw(value)
|
|
const oldValue = (target as any)[key]
|
|
if (isRef(oldValue) && !isRef(value)) {
|
|
oldValue.value = value
|
|
return true
|
|
}
|
|
const hadKey = hasOwn(target, key)
|
|
const result = Reflect.set(target, key, value, receiver)
|
|
// don't trigger if target is something up in the prototype chain of original
|
|
if (target === toRaw(receiver)) {
|
|
/* istanbul ignore else */
|
|
if (__DEV__) {
|
|
const extraInfo = { oldValue, newValue: value }
|
|
if (!hadKey) {
|
|
trigger(target, OperationTypes.ADD, key, extraInfo)
|
|
} else if (hasChanged(value, oldValue)) {
|
|
trigger(target, OperationTypes.SET, key, extraInfo)
|
|
}
|
|
} else {
|
|
if (!hadKey) {
|
|
trigger(target, OperationTypes.ADD, key)
|
|
} else if (hasChanged(value, oldValue)) {
|
|
trigger(target, OperationTypes.SET, key)
|
|
}
|
|
}
|
|
}
|
|
return result
|
|
}
|
|
|
|
function deleteProperty(target: object, key: string | symbol): boolean {
|
|
const hadKey = hasOwn(target, key)
|
|
const oldValue = (target as any)[key]
|
|
const result = Reflect.deleteProperty(target, key)
|
|
if (result && hadKey) {
|
|
/* istanbul ignore else */
|
|
if (__DEV__) {
|
|
trigger(target, OperationTypes.DELETE, key, { oldValue })
|
|
} else {
|
|
trigger(target, OperationTypes.DELETE, key)
|
|
}
|
|
}
|
|
return result
|
|
}
|
|
|
|
function has(target: object, key: string | symbol): boolean {
|
|
const result = Reflect.has(target, key)
|
|
track(target, OperationTypes.HAS, key)
|
|
return result
|
|
}
|
|
|
|
function ownKeys(target: object): (string | number | symbol)[] {
|
|
track(target, OperationTypes.ITERATE)
|
|
return Reflect.ownKeys(target)
|
|
}
|
|
|
|
export const mutableHandlers: ProxyHandler<object> = {
|
|
get: createGetter(false),
|
|
set,
|
|
deleteProperty,
|
|
has,
|
|
ownKeys
|
|
}
|
|
|
|
export const readonlyHandlers: ProxyHandler<object> = {
|
|
get: createGetter(true),
|
|
|
|
set(
|
|
target: object,
|
|
key: string | symbol,
|
|
value: unknown,
|
|
receiver: object
|
|
): boolean {
|
|
if (LOCKED) {
|
|
if (__DEV__) {
|
|
console.warn(
|
|
`Set operation on key "${String(key)}" failed: target is readonly.`,
|
|
target
|
|
)
|
|
}
|
|
return true
|
|
} else {
|
|
return set(target, key, value, receiver)
|
|
}
|
|
},
|
|
|
|
deleteProperty(target: object, key: string | symbol): boolean {
|
|
if (LOCKED) {
|
|
if (__DEV__) {
|
|
console.warn(
|
|
`Delete operation on key "${String(
|
|
key
|
|
)}" failed: target is readonly.`,
|
|
target
|
|
)
|
|
}
|
|
return true
|
|
} else {
|
|
return deleteProperty(target, key)
|
|
}
|
|
},
|
|
|
|
has,
|
|
ownKeys
|
|
}
|