types(reactivity): make sure getters defined with arrow functions work in options API

Add special versions of ComputedGetter and WritableComputedOptions that accept view model as argument

Author: unshame

packages/reactivity/src/computed.ts

@@ -16,13 +16,19 @@ export interface WritableComputedRef<T> extends Ref<T> {
 }
 
 export type ComputedGetter<T> = () => T
+export type ComputedGetterWithVModel<T> = (vm: any) => T
 export type ComputedSetter<T> = (v: T) => void
 
 export interface WritableComputedOptions<T> {
   get: ComputedGetter<T>
   set: ComputedSetter<T>
 }
 
+export interface WritableComputedOptionsWithVModel<T> {
+  get: ComputedGetterWithVModel<T>
+  set: ComputedSetter<T>
+}
+
 export class ComputedRefImpl<T> {
   public dep?: Dep = undefined
 

packages/reactivity/src/index.ts

@@ -38,7 +38,9 @@ export {
   ComputedRef,
   WritableComputedRef,
   WritableComputedOptions,
+  WritableComputedOptionsWithVModel,
   ComputedGetter,
+  ComputedGetterWithVModel,
   ComputedSetter
 } from './computed'
 export { deferredComputed } from './deferredComputed'

packages/runtime-core/src/componentOptions.ts

@@ -46,8 +46,8 @@ import {
 } from './apiLifecycle'
 import {
   reactive,
-  ComputedGetter,
-  WritableComputedOptions
+  ComputedGetterWithVModel,
+  WritableComputedOptionsWithVModel
 } from '@vue/reactivity'
 import {
   ComponentObjectPropsOptions,
@@ -360,7 +360,7 @@ export type ComponentOptionsMixin = ComponentOptionsBase<
 
 export type ComputedOptions = Record<
   string,
-  ComputedGetter<any> | WritableComputedOptions<any>
+  ComputedGetterWithVModel<any> | WritableComputedOptionsWithVModel<any>
 >
 
 export interface MethodOptions {