fix(computed): support arrow function usage for computed option

fix #733
vuejs · Feb 18, 2020 · 2fb7a63 · 2fb7a63
1 parent 9571ede
commit 2fb7a63
Show file tree

Hide file tree

Showing 3 changed files with 4 additions and 6 deletions.
diff --git a/packages/reactivity/src/computed.ts b/packages/reactivity/src/computed.ts
@@ -11,7 +11,7 @@ export interface WritableComputedRef<T> extends Ref<T> {
   readonly effect: ReactiveEffect<T>
 }
 
-export type ComputedGetter<T> = () => T
+export type ComputedGetter<T> = (ctx?: any) => T
 export type ComputedSetter<T> = (v: T) => void
 
 export interface WritableComputedOptions<T> {

diff --git a/packages/runtime-core/__tests__/apiOptions.spec.ts b/packages/runtime-core/__tests__/apiOptions.spec.ts
@@ -52,9 +52,7 @@ describe('api: options', () => {
         bar(): number {
           return this.foo + 1
         },
-        baz(): number {
-          return this.bar + 1
-        }
+        baz: (vm): number => vm.bar + 1
       },
       render() {
         return h(

diff --git a/packages/runtime-core/src/apiOptions.ts b/packages/runtime-core/src/apiOptions.ts
@@ -302,12 +302,12 @@ export function applyOptions(
       __DEV__ && checkDuplicateProperties!(OptionTypes.COMPUTED, key)
 
       if (isFunction(opt)) {
-        renderContext[key] = computed(opt.bind(ctx))
+        renderContext[key] = computed(opt.bind(ctx, ctx))
       } else {
         const { get, set } = opt
         if (isFunction(get)) {
           renderContext[key] = computed({
-            get: get.bind(ctx),
+            get: get.bind(ctx, ctx),
             set: isFunction(set)
               ? set.bind(ctx)
               : __DEV__