内置事件管理
API 提供了一套内置的事件管理系统,帮助开发者在表单中灵活地管理和触发自定义事件。这些事件可以用于组件之间的通信、状态管理、动态行为触发等场景。
数据结构
以下是 Api 内置事件管理相关的数据结构及简明解释:
ts
interface Api {
// 内置事件管理系统,支持手动触发和监听表单事件
bus: {
$emit(event: string, ...args: any[]): void; // 手动触发事件
$on(event: string | string[], callback: Function): void; // 监听事件
$once(event: string | string[], callback: Function): void; // 监听一次性事件
$off(event?: string | string[], callback?: Function): void; // 取消事件监听
};
// 手动触发表单的自定义事件
emit(event: string, ...args: any[]): void;
}
触发事件
bus.$emit
方法用于手动触发指定的事件,并可以传递多个参数。这些参数会作为事件处理函数的参数进行传递。
typescript
type emit = (event:string, ...args:any[]) => void
- 示例:
js
fApi.bus.$emit('custom-event', 'param1', 'param2');
触发事件
bus.$on
方法用于监听指定的事件,当事件被触发时,会执行注册的回调函数。可以监听一个或多个事件。
typescript
type on = (event: string, callback: Function) => void
- 示例:
js
fApi.bus.$on('custom-event', (param1, param2) => {
console.log('事件被触发:', param1, param2);
});
监听一次性事件
bus.$once
方法用于监听指定的事件,但回调函数只会执行一次,执行完后会自动取消监听。
typescript
type on = (event: string, callback: Function) => void
- 示例:
js
fApi.bus.$once('init-complete', () => {
console.log('初始化完成,事件仅触发一次');
});
取消事件监听
bus.$off
方法用于取消对指定事件的监听。
typescript
type off = (event: string, callback: Function) => void
- 示例:
js
fApi.bus.$off('custom-event', handleCustomEvent);