From 52cc7e823148289b3dcdcb6b521984ab815fce79 Mon Sep 17 00:00:00 2001 From: Evan You Date: Tue, 25 Feb 2020 19:35:48 -0500 Subject: [PATCH] refactor(directives): remove binding.instance BREAKING CHANGE: custom directive bindings no longer expose instance This is a rarely used property that creates extra complexity in ensuring it points to the correct instance. From a design perspective, a custom directive should be scoped to the element and data it is bound to and should not have access to the entire instance in the first place. --- .../runtime-core/__tests__/directives.spec.ts | 16 ---------------- packages/runtime-core/src/directives.ts | 13 ++----------- 2 files changed, 2 insertions(+), 27 deletions(-) diff --git a/packages/runtime-core/__tests__/directives.spec.ts b/packages/runtime-core/__tests__/directives.spec.ts index bfd6e439..cab514d8 100644 --- a/packages/runtime-core/__tests__/directives.spec.ts +++ b/packages/runtime-core/__tests__/directives.spec.ts @@ -9,7 +9,6 @@ import { DirectiveBinding, nextTick } from '@vue/runtime-test' -import { currentInstance, ComponentInternalInstance } from '../src/component' describe('directives', () => { it('should work', async () => { @@ -18,7 +17,6 @@ describe('directives', () => { function assertBindings(binding: DirectiveBinding) { expect(binding.value).toBe(count.value) expect(binding.arg).toBe('foo') - expect(binding.instance).toBe(_instance && _instance.proxy) expect(binding.modifiers && binding.modifiers.ok).toBe(true) } @@ -107,13 +105,9 @@ describe('directives', () => { unmounted } - let _instance: ComponentInternalInstance | null = null let _vnode: VNode | null = null let _prevVnode: VNode | null = null const Comp = { - setup() { - _instance = currentInstance - }, render() { _prevVnode = _vnode _vnode = withDirectives(h('div', count.value), [ @@ -153,7 +147,6 @@ describe('directives', () => { function assertBindings(binding: DirectiveBinding) { expect(binding.value).toBe(count.value) expect(binding.arg).toBe('foo') - expect(binding.instance).toBe(_instance && _instance.proxy) expect(binding.modifiers && binding.modifiers.ok).toBe(true) } @@ -167,13 +160,9 @@ describe('directives', () => { expect(prevVNode).toBe(_prevVnode) }) as DirectiveHook) - let _instance: ComponentInternalInstance | null = null let _vnode: VNode | null = null let _prevVnode: VNode | null = null const Comp = { - setup() { - _instance = currentInstance - }, render() { _prevVnode = _vnode _vnode = withDirectives(h('div', count.value), [ @@ -207,7 +196,6 @@ describe('directives', () => { function assertBindings(binding: DirectiveBinding) { expect(binding.value).toBe(count.value) expect(binding.arg).toBe('foo') - expect(binding.instance).toBe(_instance && _instance.proxy) expect(binding.modifiers && binding.modifiers.ok).toBe(true) } @@ -296,7 +284,6 @@ describe('directives', () => { unmounted } - let _instance: ComponentInternalInstance | null = null let _vnode: VNode | null = null let _prevVnode: VNode | null = null @@ -307,9 +294,6 @@ describe('directives', () => { } const Comp = { - setup() { - _instance = currentInstance - }, render() { return withDirectives(h(Child, { count: count.value }), [ [ diff --git a/packages/runtime-core/src/directives.ts b/packages/runtime-core/src/directives.ts index 132fbbe8..eea35b64 100644 --- a/packages/runtime-core/src/directives.ts +++ b/packages/runtime-core/src/directives.ts @@ -15,12 +15,9 @@ import { VNode } from './vnode' import { isFunction, EMPTY_OBJ, makeMap, EMPTY_ARR } from '@vue/shared' import { warn } from './warning' import { ComponentInternalInstance } from './component' -import { currentRenderingInstance } from './componentRenderUtils' import { callWithAsyncErrorHandling, ErrorCodes } from './errorHandling' -import { ComponentPublicInstance } from './componentProxy' export interface DirectiveBinding { - instance: ComponentPublicInstance | null value: any oldValue: any arg?: string @@ -108,14 +105,9 @@ export function withDirectives( vnode: T, directives: DirectiveArguments ): T { - const internalInstance = currentRenderingInstance - if (internalInstance === null) { - __DEV__ && warn(`withDirectives can only be used inside render functions.`) - return vnode - } - const instance = internalInstance.proxy const props = vnode.props || (vnode.props = {}) - const bindings = vnode.dirs || (vnode.dirs = new Array(directives.length)) + const bindings: DirectiveBinding[] = + vnode.dirs || (vnode.dirs = new Array(directives.length)) const injected: Record = {} for (let i = 0; i < directives.length; i++) { let [dir, value, arg, modifiers = EMPTY_OBJ] = directives[i] @@ -127,7 +119,6 @@ export function withDirectives( } bindings[i] = { dir, - instance, value, oldValue: void 0, arg,