Aurelia教程

Aurelia 事件聚合器

当您的事件需要附加到更多侦听器或需要观察应用的某些功能并等待数据更新时,应使用事件聚合器。
Aurelia 事件聚合器具有三种方法。 publish 方法将触发事件并可供多个订阅者使用。对于订阅事件,我们可以使用 subscribe 方法。最后,我们可以使用 dispose 方法分离订阅者。以下示例演示了这一点。
对于三个功能中的每一个,我们的视图只有三个按钮。

app.html

<template>
   <button click.delegate = "publish()">PUBLISH</button><br/>
   <button click.delegate = "subscribe()">SUBSCRIBE</button><br/>
   <button click.delegate = "dispose()">DISPOSE</button>
</template>
我们需要导入 eventAggregator 并注入它,然后才能使用它。

app.js

import {inject} from 'aurelia-framework';
import {EventAggregator} from 'aurelia-event-aggregator';
@inject(EventAggregator)
export class App {
   constructor(eventAggregator) {
      this.eventAggregator = eventAggregator;
   }
   publish() {
      var payload = 'this is some data...';
      this.eventAggregator.publish('myEventName', payload);
   }
   subscribe() {
      this.subscriber = this.eventAggregator.subscribe('myEventName', payload => {
         console.log(payload);
      });
   }
   dispose() {
      this.subscriber.dispose();
      console.log('Disposed!!!');
   }
}
我们需要点击 SUBSCRIBE按钮来监听未来将要发布的数据。一旦订阅者被附加,每当发送新数据时,控制台都会记录它。如果我们点击 PUBLISH 按钮五次,我们会看到它每次都被记录。
Aurelia 事件聚合器示例
我们也可以通过点击 DISPOSE 按钮来分离我们的订阅者。
昵称: 邮箱:
Copyright © 2022 立地货 All Rights Reserved.
备案号:京ICP备14037608号-4