Spartacus 事件服务提供了一个事件流，开发人员能够在不与特定组件或模块严密集成的状况下应用它。在Spartacus中，事件零碎用于构建与第三方零碎的集成，如标签管理器(Tag Management)和网络跟踪器。

从 event.service.ts 文件中导入 EventService：

事件服务还容许开发人员解耦某些组件。例如，可能有一个分派事件的组件，即事件的产生者，和另一个响应此事件的组件，即事件的监听者。

二者之间不须要有任何硬依赖关系。

事件是由TypeScript类驱动的，TypeScript类是给定事件的签名，能够实例化。示例如下:

import { CxEvent } from "@spartacus/core";export class CartAddEntryEvent extends CxEvent {  cartId: string;  userId: string;  productCode: string;  quantity: number;}

下图是另一个 LanguageSetEvent，继承自 CxEvent，在此基础上削减了 activeLanguage 属性：

如何监听一个事件？

要察看给定类型的事件，能够获取事件类型的流，而后在须要的时候订阅它。上面是一个 CartAddEntryEvent 监听的例子:

constructor(events: EventService){}/* ... */const result$ = this.events.get(CartAddEntrySuccessEvent);result$.subscribe((event) => console.log(event));

如果须要比特定事件中蕴含的数据更多的数据，您能够将该数据与其余流(stream)组合。例如，能够从 Spartacus facade 收集额定的数据。

上面是一个响应“增加到购物车事件”的例子，而后期待购物车处于 stable 状态(因为 OCC购物车须要从后端从新加载)，而后将所有的购物车数据附加到事件中的数据:

constructor(    events: EventService,    cartService: ActiveCartService    ){}/* ... */const result$ = this.events.get(CartAddEntrySuccessEvent).pipe(    // When the above event is captured, wait for the cart to be stable    // (because OCC reloads the cart after any cart operation)...    switchMap((event) =>        this.cartService.isStable().pipe(filter(Boolean), mapTo(event))    ),    // Merge the state snapshot of the cart with the data from the event:    withLatestFrom(this.cartService.getActive()),    map(([event, cart]) => ({ ...event, cart })));

上述代码的关键点：

  • switchMap 须要返回一个 Observable 对象。
  • 通过 filter 保障 Cart 处于 Stable 时再进行后续解决。
  • mapTo event 抛弃了 Cart Stable 状态，从新映射回 event 对象
  • withLatestFrom：从 cartService 读取 Stable 的 Cart 数据，此时通过后面的 filter 操作，能保障 Cart 肯定曾经 Stable 了。