Ember.js 是一个流行的前端框架，提供了丰富的API和工具，使得构建前端应用更加容易。为了进一步提高用户体验，我们通常需要使用消息传递，以一个可扩展、可维护的方式，使得应用程序的不同组件之间进行通信。在这方面，一个称之为 'ember-pubsub’ 的 npm 包就有很大的作用。
什么是 ember-pubsub？
'ember-pubsub' 是一个小而强大的 npm 包，用于在Ember.js应用程序中实现简单的发布/订阅模式。它提供了一种简单的方式，使两个或多个组件之间进行通信，避免了尴尬的组件嵌套或父子组件传递数据。
下面是 ember-pubsub 可以执行的最常见操作：
- 发布事件
- 订阅事件
- 取消订阅事件
- 触发事件
安装 ember-pubsub
首先，应该通过 npm 安装 'ember-pubsub' 包:
npm install ember-pubsub --save-dev
基本用法
使用 ember-pubsub，我们首先需要在需要传递的组件上 import 引入两个API： pub 与 sub。
在发布者组件中：
-- -------------------- ---- -------
------ - --- - ---- ---------------
------ ------- ------------------------
--------
--- -------- - --------------------------
-- ----
------------ ----------
-
---在订阅者组件中：
-- -------------------- ---- -------
------ - --- - ---- ---------------
------ ------- ------------------------
-------
--------------------------
-- ----
------------ ----- ----------------
--
---------------------- -
--------- ----------- ----
-
---在这个示例中，发布者组件定义了一个在 click 事件中发布 'login' 事件。 然后，订阅者组件从 'login' 订阅该事件，并将 'showUserName' 方法作为回调。 当发布者组件发布 'login' 事件时，订阅者组件通过 'showUserName' 方法获得该事件的数据。
其他用法
除了基本用法之外，'ember-pubsub' 还提供了一些其他的用法：
取消订阅事件
如果订阅者不再需要接收事件，可以取消订阅：
unsubscribe(){
// 取消订阅事件
unsubscribe('login', this, 'showUserName');
}触发事件
除了发布事件之外，您还可以通过 trigger API 手动触发事件：
import { trigger } from 'ember-pubsub';
function someFunction(){
var data = 'some data';
//触发事件
trigger('someEvent', data);
}销毁订阅
当组件销毁时，订阅也应该被销毁。 在 Ember.js 中，您可以通过 'willDestroyElement' 钩子来实现此目的：
willDestroyElement(){
sub('login', this, 'showUserName').unsubscribe();
this._super();
}总结
'ember-pubsub' 是一个非常方便的工具，它使得在 Ember.js 应用程序中传递消息变得非常容易。 通过使用这个包，您可以将消息的传递变得更加容易、可扩展和可维护。 希望这篇文章可以帮助你更好地使用 'ember-pubsub'。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066e18a563576b7b1ecb46