FastEvent

Appearance

调试与诊断 ​

调试组件 ​

FastEvent 提供专门的WebComponent调试组件fastevent-viewer，可以查看触发的事件、监听器注册等信息。

在你的应用入口文件中导入fastevent/viewer.

html
<html>
    <!-- 引入FastEvent -->
    <script src="https://unpkg.com/fastevent@latest/dist/index.js"></script>
    <!-- 引入FastEvent Viewer组件-->
    <script src="https://unpkg.com/fastevent@latest/dist/viewer/index.js"></script>
<body>
    <fastevent-viewer id="viewer"></fastevent-viewer>
</body>
</html>
<script>
const { FastEvent } = FastEventSpaces
const emitter = new FastEvent();
const viewer = document.getElementById("viewer")
viewer.emitter = emitter
// 也支持同时绑定多个FastEvent实例
viewer.emitter = [emitter1,...,emitterN]
loading

提示

fastevent-viewer是一个WebComponent。

监听信息 ​

FastEvent还提供了一些辅助机制来帮助调试。

  • 获取事件监听器元数据
ts
import { FastEvent } from "fastevent";
const emitter = new FastEvent();

const listener1 = () => {};
const listener2 = () => {};
const listener3 = () => {};

emitter.on("test", listener1);
emitter.on("test", listener2, { count: 10 });
emitter.once("test", listener3);

const metas = emitter.getListeners("test"); 
console.log(metas);
// [[listener1,0,0],[listener2,10,0],[listener3,0,1]]
  • getListeners方法用于获取事件监听器元数据，返回监听器注册信息FastListenerMeta。
ts
type FastListenerMeta = [TypedFastEventListener<any, any>, number, number, string，number]

FastListenerMeta是一个数组，包含以下信息：

位置 类型 说明
0 TypedFastEventListener 监听器函数
1 number 监听器调用限制次数，0表示无限制，1代表只调用一次
2 number 监听器实际执行的次数，当达到限制次数后，监听器将被移除
3 string 额外的标签，用于标识监听器，供调试使用
4 number 标识，用于额外标识监听器，高级选项
5 any 当debug=true时
  • 事件监听器标签

使用getListeners方法获取监听器元数据时，有时无法获取监听函数的更详细信息。 此时，你可以为监听器添加额外的标签，用于标识监听器。

ts
import { FastEvent } from "fastevent";
const emitter = new FastEvent();

const listener = () => {};

emitter.on("test", listener, {
    tag: "modulex", 
});

const metas = emitter.getListeners("test"); 
console.log(metas);
// [[listener,0,0,modulex]]

提示

通过FastEvent.listeners可以查看所有的监听器注册信息。