feat: $nextTick, $forceUpdate, $watch

This commit is contained in:
Evan You 2019-09-03 23:04:11 -04:00
parent a6616e4210
commit b4c909c260
2 changed files with 34 additions and 5 deletions

View File

@ -13,7 +13,7 @@ import {
EMPTY_OBJ EMPTY_OBJ
} from '@vue/shared' } from '@vue/shared'
import { computed, ComputedOptions } from './apiReactivity' import { computed, ComputedOptions } from './apiReactivity'
import { watch } from './apiWatch' import { watch, WatchOptions } from './apiWatch'
import { provide, inject } from './apiInject' import { provide, inject } from './apiInject'
import { import {
onBeforeMount, onBeforeMount,
@ -133,10 +133,8 @@ export function processOptions(instance: ComponentInstance) {
} else if (isFunction(raw)) { } else if (isFunction(raw)) {
watch(getter, raw.bind(ctx)) watch(getter, raw.bind(ctx))
} else if (isObject(raw)) { } else if (isObject(raw)) {
watch(getter, raw.handler.bind(ctx), { // TODO 2.x compat
deep: !!raw.deep, watch(getter, raw.handler.bind(ctx), raw)
lazy: !raw.immediate
})
} else if (__DEV__) { } else if (__DEV__) {
// TODO warn invalid watch options // TODO warn invalid watch options
} }
@ -201,3 +199,16 @@ export function processOptions(instance: ComponentInstance) {
onUnmounted(destroyed.bind(ctx)) onUnmounted(destroyed.bind(ctx))
} }
} }
export function legacyWatch(
this: ComponentInstance,
source: string | Function,
cb: Function,
options?: WatchOptions
): () => void {
const ctx = this.renderProxy as any
const getter = isString(source) ? () => ctx[source] : source.bind(ctx)
const stop = watch(getter, cb.bind(ctx), options)
onBeforeMount(stop, this)
return stop
}

View File

@ -1,4 +1,6 @@
import { ComponentInstance } from './component' import { ComponentInstance } from './component'
import { nextTick } from './scheduler'
import { legacyWatch } from './apiOptions'
export const RenderProxyHandlers = { export const RenderProxyHandlers = {
get(target: ComponentInstance, key: string) { get(target: ComponentInstance, key: string) {
@ -26,7 +28,23 @@ export const RenderProxyHandlers = {
return target.root return target.root
case '$emit': case '$emit':
return target.emit return target.emit
case '$el':
return target.vnode.el
case '$options':
// TODO handle merging
return target.type
default: default:
// methods are only exposed when options are supported
if (__FEATURE_OPTIONS__) {
switch (key) {
case '$forceUpdate':
return target.update
case '$nextTick':
return nextTick
case '$watch':
return legacyWatch.bind(target)
}
}
return target.user[key] return target.user[key]
} }
} }