Introducing KickStart —  AI generated FormKit forms in seconds. Generate from a screenshot, edit with drag-and-drop or conversational AI, copy & paste as components or schema!
Try for free

@formkit/observer

简介

FormKit Observer是一个实用工具,用于将FormKitNode包装在依赖跟踪观察者代理中。

函数

createObserver()

创建观察者。

签名

createObserver(node: FormKitNode, dependencies?: FormKitDependencies): FormKitObservedNode;

参数

  • node — 要观察的 FormKitNode
  • dependencies 可选 — 依赖的节点和需要监视变化的事件。

返回

返回一个 FormKitObservedNode

diffDeps()

确定哪些节点应该被添加为依赖,哪些应该被移除。

签名

diffDeps(previous: FormKitDependencies, current: FormKitDependencies): [FormKitDependencies, FormKitDependencies];

参数

  • previous — 之前的观察者依赖。
  • current — 新的/当前的观察者依赖。

返回

一个元组的映射:toAddtoRemove

isKilled()

检查给定的节点是否被撤销。

签名

isKilled(node: FormKitObservedNode): boolean;

参数

  • node — 任何要检查的观察节点。

返回

一个 boolean,表示节点是否被撤销。

removeListeners()

从观察节点和子树中移除所有的收据。

签名

removeListeners(receipts: FormKitObserverReceipts): void;

参数

  • receipts — 要移除的FormKit观察者收据。

TypeScript

FormKitObservedNode

一个与FormKitNode兼容的API,能够确定节点及其值的完整依赖树。

interface FormKitObservedNode extends FormKitNode {
    _node: FormKitNode;
    deps: FormKitDependencies;
    kill: () => undefined;
    observe: () => void;
    receipts: FormKitObserverReceipts;
    stopObserve: () => FormKitDependencies;
    watch:<TextendsFormKitWatchable>(block: T, after?: (value: ReturnType<T>) => void) => void;
}

FormKitWatchable

一个用于监视节点的回调。

interface FormKitWatchable<T = unknown> {
    (node: FormKitObservedNode): T;
}

FormKitDependencies

依赖的节点和需要监视变化的事件。

export type FormKitDependencies = Map<FormKitNode, Set<string>> & {
    active?: boolean;
};

FormKitObserverReceipts

节点的映射,其值为eventsName: receipt的映射

export type FormKitObserverReceipts = Map<FormKitNode, {
    [index: string]: string;
}>;