diff --git a/types/index.d.ts b/types/index.d.ts index 968dbb59..50c5bac3 100644 --- a/types/index.d.ts +++ b/types/index.d.ts @@ -6,12 +6,12 @@ import * as VNode from "./vnode"; // `Vue` in `export = Vue` must be a namespace // All available types are exported via this namespace declare namespace Vue { - export type ComponentOptions = Options.ComponentOptions; + export type ComponentOptions = Options.ComponentOptions; export type FunctionalComponentOptions = Options.FunctionalComponentOptions; export type RenderContext = Options.RenderContext; export type PropOptions = Options.PropOptions; - export type ComputedOptions = Options.ComputedOptions; - export type WatchHandler = Options.WatchHandler; + export type ComputedOptions = Options.ComputedOptions; + export type WatchHandler = Options.WatchHandler; export type WatchOptions = Options.WatchOptions; export type DirectiveFunction = Options.DirectiveFunction; export type DirectiveOptions = Options.DirectiveOptions; diff --git a/types/options.d.ts b/types/options.d.ts index 2ce0718f..ecbc08e2 100644 --- a/types/options.d.ts +++ b/types/options.d.ts @@ -7,37 +7,37 @@ type Constructor = { type $createElement = typeof Vue.prototype.$createElement; -export interface ComponentOptions { - data?: Object | ( (this: Vue) => Object ); +export interface ComponentOptions { + data?: Object | ((this: V) => Object); props?: string[] | { [key: string]: PropOptions | Constructor | Constructor[] }; propsData?: Object; - computed?: { [key: string]: ((this: Vue) => any) | ComputedOptions }; + computed?: { [key: string]: ((this: V) => any) | ComputedOptions }; methods?: { [key: string]: Function }; - watch?: { [key: string]: ({ handler: WatchHandler } & WatchOptions) | WatchHandler | string }; + watch?: { [key: string]: ({ handler: WatchHandler } & WatchOptions) | WatchHandler | string }; el?: Element | String; template?: string; - render?(createElement: $createElement): VNode; - staticRenderFns?: (() => VNode)[]; + render?(this: V, createElement: $createElement): VNode; + staticRenderFns?: ((createElement: $createElement) => VNode)[]; - beforeCreate?(): void; - created?(): void; - beforeDestroy?(): void; - destroyed?(): void; - beforeMount?(): void; - mounted?(): void; - beforeUpdate?(): void; - updated?(): void; + beforeCreate?(this: V): void; + created?(this: V): void; + beforeDestroy?(this: V): void; + destroyed?(this: V): void; + beforeMount?(this: V): void; + mounted?(this: V): void; + beforeUpdate?(this: V): void; + updated?(this: V): void; directives?: { [key: string]: DirectiveOptions | DirectiveFunction }; - components?: { [key: string]: ComponentOptions | FunctionalComponentOptions | typeof Vue }; + components?: { [key: string]: ComponentOptions | FunctionalComponentOptions | typeof Vue }; transitions?: { [key: string]: Object }; filters?: { [key: string]: Function }; parent?: Vue; - mixins?: (ComponentOptions | typeof Vue)[]; + mixins?: (ComponentOptions | typeof Vue)[]; name?: string; - extends?: ComponentOptions | typeof Vue; + extends?: ComponentOptions | typeof Vue; delimiters?: [string, string]; } @@ -63,13 +63,13 @@ export interface PropOptions { validator?(value: any): boolean; } -export interface ComputedOptions { - get?(this: Vue): any; - set?(this: Vue, value: any): void; +export interface ComputedOptions { + get?(this: V): any; + set?(this: V, value: any): void; cache?: boolean; } -export type WatchHandler = (val: T, oldVal: T) => void; +export type WatchHandler = (this: V, val: any, oldVal: any) => void; export interface WatchOptions { deep?: boolean; diff --git a/types/test/options-test.ts b/types/test/options-test.ts index 5736c279..d60399ad 100644 --- a/types/test/options-test.ts +++ b/types/test/options-test.ts @@ -7,6 +7,8 @@ interface Component extends Vue { Vue.component('component', { data() { + this.$mount + this.a return { a: 1 } @@ -50,7 +52,9 @@ Vue.component('component', { }, 'b': 'someMethod', 'c': { - handler(val: number, oldval: number) {}, + handler(val, oldVal) { + this.a = val + }, deep: true } }, @@ -91,7 +95,9 @@ Vue.component('component', { }, staticRenderFns: [], - beforeCreate() {}, + beforeCreate() { + this.a = 1; + }, created() {}, beforeDestroy() {}, destroyed() {}, @@ -120,7 +126,7 @@ Vue.component('component', { }, components: { a: Vue.component(""), - b: {} as ComponentOptions + b: {} as ComponentOptions }, transitions: {}, filters: { @@ -129,11 +135,11 @@ Vue.component('component', { } }, parent: new Vue, - mixins: [Vue.component(""), ({} as ComponentOptions)], + mixins: [Vue.component(""), ({} as ComponentOptions)], name: "Component", - extends: {} as ComponentOptions, + extends: {} as ComponentOptions, delimiters: ["${", "}"] -} as ComponentOptions); +} as ComponentOptions); Vue.component('functional-component', { props: ['prop'], diff --git a/types/vue.d.ts b/types/vue.d.ts index ac2039fe..3f735a02 100644 --- a/types/vue.d.ts +++ b/types/vue.d.ts @@ -11,11 +11,11 @@ import { PluginFunction, PluginObject } from "./plugin"; export declare class Vue { - constructor(options?: ComponentOptions); + constructor(options?: ComponentOptions); $data: Object; readonly $el: HTMLElement; - readonly $options: ComponentOptions; + readonly $options: ComponentOptions; readonly $parent: Vue; readonly $root: Vue; readonly $children: Vue[]; @@ -30,7 +30,7 @@ export declare class Vue { $delete: typeof Vue.delete; $watch( expOrFn: string | Function, - callback: WatchHandler, + callback: WatchHandler, options?: WatchOptions ): (() => void); $on(event: string, callback: Function): this; @@ -54,7 +54,7 @@ export declare class Vue { keyCodes: { [key: string]: number }; } - static extend(options: ComponentOptions): typeof Vue; + static extend(options: ComponentOptions): typeof Vue; static nextTick(callback: () => void, context?: any[]): void; static set(object: Object, key: string, value: T): T; static set(array: T[], key: number, value: T): T; @@ -67,11 +67,11 @@ export declare class Vue { static filter(id: string, definition?: Function): Function; static component( id: string, - definition?: ComponentOptions | FunctionalComponentOptions | typeof Vue + definition?: ComponentOptions | FunctionalComponentOptions | typeof Vue ): typeof Vue; static use(plugin: PluginObject | PluginFunction, options?: T): void; - static mixin(mixin: typeof Vue | ComponentOptions): void; + static mixin(mixin: typeof Vue | ComponentOptions): void; static compile(template: string): { render(createElement: typeof Vue.prototype.$createElement): VNode; staticRenderFns: (() => VNode)[];