Definición de tipo de TypeScript para patrón de módulo personalizado
Estoy intentando escribir una definición de tipo para una especificación de módulo personalizada que he heredado aquí. No puedo resolverlo. El truco es que el contexto this en el contexto calculado en las funciones debe estar determinado por las propiedades de manera que shouldBeValueA esté determinado por keyA.
define.model("moduleName",
[
"jquery"
],
function($) {
return this.viewModel({
pub: {
properties: {
keyA: "valueA"
},
functions: {
keyB: this.computed(function() {
var shouldBeValueA = this.keyA;
})
}
}
})
})
La mejor definición que tengo hasta ahora:
interface Define {
model: (
name: string,
dependencies: string[],
moduleContext: <T>(this: {
computed: (context: (this: T) => any) => KnockoutComputed<any>,
viewModel: (options: {
pub: {
properties: T,
functions: any
},
}) => any;
},
...args) => void) => void;
}
declare var define: Define;
Pero este error: "La propiedad keyA no existe en el tipo T"
Respuesta #1
No estoy seguro de si esto ayudará a alguien más, pero @kingdaro tiene razón en que este patrón es muy similar a la API de vue.js. Eventualmente construí una definición de tipo inspirada en ese patrón.
interface RequireDefine {
model<TPubProps, TPubFuncs, TPrivProps, TPrivFuncs>(
name: string,
deps: string[],
factory: (
this: {
viewModel<TPubProps, TPubFuncs, TPrivProps, TPrivFuncs>(
options: ThisTypedViewModelOptions<TPubProps, TPubFuncs, TPrivProps, TPrivFuncs>
): TPubProps & TPubFuncs
): any
}
type ThisTypedViewModelOptions<TPubProps, TPubFuncs, TPrivProps, TPrivFuncs> =
object
& ViewModelOptions<TPubProps, TPubFuncs, TPrivProps, TPrivFuncs>
& ThisType<CombinedViewModelInstance<TPubProps, TPubFuncs, TPrivProps, TPrivFuncs>>
type CombinedViewModelInstance<TPubProps, TPubFuncs, TPrivProps, TPrivFuncs> = TPubProps & TPubFuncs & { priv: () => TPrivProps & TPrivFuncs }
type DefaultMethods = { [key: string]: (...args: any[]) => any };
interface ViewModelOptions<
TPubProps = object,
TPubFuncs = DefaultMethods,
TPrivProps = object,
TPrivFuncs = DefaultMethods
> {
ctor?: (options?: any) => void,
pub?: {
properties?: TPubProps,
functions?: TPubFuncs
},
priv?: {
properties?: TPrivProps,
functions?: TPrivFuncs
}
}
Todavía no es completamente perfecto, pero fue una buena experiencia de aprendizaje adaptar los tipos de Vue a esta estructura de modelo de vista.
