import type { IntersectionObserver, IntersectionObserverOptions } from "../apis/ksml/IntersectionObserver"; import type { SelectorQuery } from "../apis/ksml/SelectorQuery"; import type { BehaviorOptions } from "./behavior"; import type { AnyObject, PageResizeEvent } from "./common"; interface ComponentProperties { /** * 组件的文件路径 */ is: string; /** * 节点id */ id: string; /** * 节点dataset */ dataset: AnyObject; } export interface ComponentLifeCycle { /** * 组件生命周期声明对象,组件的生命周期:`created`、`attached`、`ready`、`moved`、`detached` 将收归到 `lifetimes` 字段内进行声明,原有声明方式仍旧有效,如同时存在两种声明方式,则 `lifetimes` 字段内声明方式优先级最高 */ lifetimes: Partial<{ /** * 在组件实例刚刚被创建时执行。 */ created(): void; /** * 在组件实例进入页面节点树时执行。 */ attached(): void; /** * 在组件在视图层布局完成后执行。 */ ready(): void; /** * 在组件实例被移动到节点树另一个位置时执行。 */ moved(): void; /** * 在组件实例被从页面节点树移除时执行。 */ detached(): void; /** * 每当组件方法抛出错误时执行。 * @param err 抛出的错误 */ error(err: Error): void; }>; /** * @deprecated 起请在 lifetimes 中定义 * 在组件实例刚刚被创建时执行。 */ created(): void; /** * @deprecated 起请在 lifetimes 中定义 * 在组件实例进入页面节点树时执行。 */ attached(): void; /** * @deprecated 起请在 lifetimes 中定义 * 在组件在视图层布局完成后执行。 */ ready(): void; /** * @deprecated 起请在 lifetimes 中定义 * 在组件实例被移动到节点树另一个位置时执行。 */ moved(): void; /** * @deprecated 起请在 lifetimes 中定义 * 在组件实例被从页面节点树移除时执行。 */ detached(): void; /** * @deprecated 起请在 lifetimes 中定义 * 每当组件方法抛出错误时执行。 * @param err 抛出的错误 */ error(err: Error): void; } export interface RelationOption { /** * 目标组件的相对关系 */ type: 'parent' | 'child' | 'ancestor' | 'descendant'; /** * 关系生命周期函数,当关系被建立在页面节点树中时触发,触发时机在组件 attached 生命周期之后。 * @param target 关系节点实例对象 */ linked?(target: ComponentInstance): void; /** * 关系生命周期函数,当关系在页面节点树中发生改变时触发,触发时机在组件 moved 生命周期之后。 * @param target 关系节点实例对象 */ linkChanged?(target: ComponentInstance): void; /** * 关系生命周期函数,当关系脱离页面节点树时触发,触发时机在组件 detached 生命周期之后。 * @param target 关系节点实例对象 */ unlinked?(target: ComponentInstance): void; /** * 如果这一项被设置,则它表示关联的目标节点所应具有的behavior,所有拥有这一behavior的组件节点都会被关联 */ target?: string | BehaviorOptions; } export interface PageLifetimes { /** 页面生命周期回调—监听页面显示 * * 页面显示/切入前台时触发。 */ show(): void; /** 页面生命周期回调—监听页面隐藏 * * 页面隐藏/切入后台时触发。 如 `navigateTo` 或底部 `tab` 切换到其他页面,小程序切入后台等。 */ hide(): void; /** 页面生命周期回调—监听页面尺寸变化 * * 所在页面尺寸变化时执行 */ resize(size: PageResizeEvent): void; } /** * 简易定义属性类型 * @example * ```ts * Component({ * properties: { * size: Array as PropType, * } * }) * ``` */ export declare type PropType = (() => T) | (new (...args: never[]) => T); /** * 完整定义组件属性的类型(有默认值) * @example * ```ts * Component({ * properties: { * size: { * type: String, * optionalTypes: [Number], * value: 'large' * } as FullProperty<'large' | 'small' | Number> * } * }) * ``` */ export declare type FullPropType = FullProperty, true>; /** * 完整定义组件属性的类型(无默认值) * @example * ```ts * Component({ * properties: { * size: { * type: String, * optionalTypes: [Number], * } as OptionalType<'large' | 'small' | Number> * } * }) * ``` */ export declare type OptionalType = FullProperty, false>; declare type ValueType = T extends StringConstructor ? string : T extends NumberConstructor ? number : T extends BooleanConstructor ? boolean : T extends PropType ? R : T extends null ? null : T extends any ? any : never; declare type PropValueType = T extends null ? any : T extends FullProperty ? (T extends { value: any; } ? never : undefined) | ValueType : undefined | ValueType; /** * observer 函数类型 */ export declare type Observer = (newVal: undefined | T, oldVal: undefined | T, changedPath: (string | number)[]) => void; export declare type FullProperty = HasDefault extends true ? { /** 属性类型 */ type: T; /** 属性初始值 */ value: ValueType; /** 属性值被更改时的响应函数 */ observer?: Observer>; /** 属性的类型(可以指定多个) */ optionalTypes?: T[]; } : { /** 属性类型 */ type: T; /** 属性值被更改时的响应函数 */ observer?: Observer>; /** 属性的类型(可以指定多个) */ optionalTypes?: T[]; }; export declare type DefinitionFilter = >( /** * 使用该 behavior 的 component/behavior 的定义对象。 */ defFields: T, /** * 该 behavior 所使用的 behavior 的 definitionFilter 函数列表。 */ definitionFilterArr?: DefinitionFilter[]) => void; export declare type ComponentOptions | PropType>, Methods extends AnyObject, Other extends AnyObject = AnyObject> = Partial<{ /** * 组件的初始数据 */ data: Data; /** * 组件的对外属性,是属性名到属性设置的映射表 */ properties: Props; /** * 组件的方法,包括事件响应函数和任意的自定义方法,关于事件响应函数的使用 */ methods: Methods; /** * 类似于 mixin s和 traits 的组件间代码复用机制 */ behaviors: (string | BehaviorOptions)[]; /** * 组件数据字段监听器,用于监听 properties 和 data 的变化 */ observers?: { [Key in keyof Props | keyof Data]?: (Key extends keyof Props ? (value: PropValueType) => void : never) | (Key extends keyof Data ? (value: Data[Key]) => void : never); }; /** * 组件间关系定义 */ relations: Record; pageLifetimes: Partial; /** * 定义段过滤器,用于自定义组件扩展 */ definitionFilter?: DefinitionFilter; }> & Partial & ThisType> & Other; export interface TriggerEventOption { /** * 事件是否冒泡。 * * 默认值: `false` */ bubbles?: boolean; /** * 事件是否可以穿越组件边界,为 false 时,事件将只能在引用组件的节点树上触发,不进入其他任何组件内部。 * * 默认值: `false` */ composed?: boolean; /** * 事件是否拥有捕获阶段。 * * 默认值: `false` */ capturePhase?: boolean; } interface ComponentMethods { /** * 检查组件是否具有 `behavior`(检查时会递归检查被直接或间接引入的所有 behavior ) * @param behavior 检查的 `behavior` */ hasBehavior(behavior: string | BehaviorOptions): void; /** * 触发事件 * @param name 事件名称 * @param detail 事件参数 * @param options 时间选项 */ triggerEvent(name: string, detail?: any, options?: TriggerEventOption): void; /** * 创建并返回一个 `SelectorQuery` 对象实例。在自定义组件或包含自定义组件的页面中使用,用法同 ks.createSelectorQuery。 * @returns `SelectorQuery` 对象实例, 用于查询节点信息 */ createSelectorQuery(): SelectorQuery; /** * 创建并返回一个 `IntersectionObserver` 对象实例。在自定义组件或包含自定义组件的页面中使用,用法同 ks.createIntersectionObserver。 */ createIntersectionObserver(options: IntersectionObserverOptions): IntersectionObserver; /** * 使用选择器选择组件实例节点,返回匹配到的第一个组件实例对象。 * @param selector 选择器 * @returns 匹配到的第一个组件实例对象 */ selectComponent | void>(selector: string): ComponentInstanceType | null; /** * 使用选择器选择组件实例节点,返回匹配到的全部组件实例对象组成的数组。 * @param selector 选择器 * @returns 匹配到的全部组件实例对象组成的数组 */ selectAllComponents | void>(selector: string): ComponentInstanceType[]; /** * 获取这个关系所对应的所有关联组件节点。 * @param relationKey 关联组件的路径 * @returns 所有关联组件节点数组 */ getRelationNodes | void>(relationPath: string): ComponentInstanceType[]; /** * 返回页面标识符,可以用来判断几个自定义组件实例是不是在同一个页面内。 * @returns 面标识符 */ getPageId(): string; } export declare type ComponentInstance any> = Record any>, Other extends AnyObject = AnyObject> = Partial & ComponentMethods & ComponentProperties & Method & { /** * 组件数据,包括内部数据和属性值 */ data: { [Key in keyof Props | keyof Data]: (Key extends keyof Props ? PropValueType : never) | (Key extends keyof Data ? Data[Key] : never); }; /** * 页面的属性数据 */ properties: { [KEY in keyof Props]: PropValueType; }; /** * 改变页面的数据。 * @param data 这次要改变的数据 * @param callback setData引起的界面更新渲染完毕后的回调函数 */ setData(data: Partial & AnyObject, callback?: () => void): void; } & { /** * @deprecated */ __wxExparserNodeId__: string; } & { [key in keyof Other as (key extends keyof ComponentOptions<{}, {}, {}, {}> ? never : key)]: Other[key]; }; export declare type ComponentInstanceType | void> = (T extends ComponentOptions ? ComponentInstance : never); export declare type ComponentConstructor = | PropType>, Data extends AnyObject = {}, Methods extends AnyObject = {}, Other extends AnyObject = {}>(options: ComponentOptions) => void | ComponentOptions; export {};