2010-08-06 73 views
5

我需要Web应用程序中的组件间通信,并且正在考虑采用不同的方法来实现此目的。我有一些想法,但会欢迎其他想法。javascript中的组件间通信

首先,一个快速简单的例子。我在页面上有两个单独的组件,这些组件是异步加载的。通过组件,我的意思是一个HTML块,它有一个JavaScript对象与它关联,其中包括基于jQuery的行为在HTML节点上。当用户与一个组件进行交互时,应该在另一个组件中进行更改,反之亦然。

这里要记住的关键是每个组件应该是一个独立的单元。它可以在应用程序的不同部分,甚至不同的应用程序中重复使用。所以它不知道页面上其他组件的存在。

我对解决方案的当前想法包括让组件监听他们感兴趣的自定义事件,并在发生操作时发送自定义事件。因此,每个组件都会侦听由另一个组件触发的事件。

问题是,由于异步加载,一个组件可能需要更长的时间才能加载。有可能一个事件发送得太快而丢失。在某些情况下,这可能会很好,但在某些情况下,我需要确保组件发送的所有事件都被消耗。

所以这里的一些相关问题:

  1. 被触发后发生的事件是什么?如果在触发时没有听众,它会消失吗?

  2. 有没有一种方法可以检测到触发的偶数是否被消耗或丢失?

  3. 什么是一些很好的方法,让每个组件去了解其他组件

  4. 是否有任何现有的开源JavaScript项目或jQuery插件处理这些类型的东西?

在关于问题3,我在想,每一个组件可以发出某种寄存器事件,包括事件类型,它听来,它已注册的组件列表用。组件会监听这些注册事件。某些使用定时器的注册逻辑将用于确保在组件加载过程中正确的组件注册在一起。一旦注册完成,组件将能够发送正常事件。

回答

1

Web服务是一个很好的参考。当你有用于云计算的互联网服务(或任何分布式计算平台)时,他们通常在它们之间实现某种消息队列或“总线”。

你可能会认为有关创建处理的“事件”,并可以将其发布到用户或直至采取动作就可以抓住它的全局消息队列(通常称为作业)。

+1

这是一个好主意。消息总线可以位于应用程序级别,并可在页面加载时启动。然后组件只发送事件,总线捕捉它们,并将它们推送给适当的订户,或者保存到它们中,直到订户注册。如果事件的生存时间到期,它甚至可能会通知原始发送组件该事件失败。 – Tauren 2010-08-06 20:06:54

1

我不知道这是否完全封装你想要做什么,但它听起来像JavaScriptMVC一个开源项目,可能对你有用。这个开源框架让控制器可以处理事件委派并提供你正在寻找的一些分离。它还利用了引擎盖下的jQuery。

该网站有点难以浏览(或至少找到很多具体的信息),但介绍视频是有用的(12分钟的长度)。

希望这会有所帮助!祝你好运!

+0

谢谢!我已经查看过JavascriptMVC,但尚未使用它。我不确定它是否是适合这项工作的正确工具,因为它的大部分功能已在我的应用程序中以不同方式处理。但我会更多地关注事件处理。我希望能找到一些更轻量化的学习曲线。 – Tauren 2010-08-06 20:09:24

4

消息排队确实是你似乎在寻找。我敢肯定,你可以设想各种涉及观察者对象的方案,这些观察者对象监听自定义事件,接收消息,播放时间和顺序,节流,广播等。但在讨论所有这些之前,请看看这个jQuery message queuing plug-in。可能是一个很好的起点。

+0

非常酷!我之前已经探索过本·阿尔曼的插件,但是当时一定不需要这样的东西,并且忘了它。感谢您指出,它可能是完美的。 – Tauren 2010-08-06 20:14:47

1

有关事件管理的其他要考虑的事项是来自Microsoft(RxJS)的Reactive Extensions for JavaScript。它与JavaScriptMVC中控制器的相同类型的行在Observable序列中注册事件,但您可以使用类似LINQ的语法与它们交互。

Matthew Podwysocki有许多关于使用RxJS的好博客文章。这里有几个不错的帖子:

Introduction to RxJS(很好的介绍)
Error Handling Pt. 2链接到他的许多其他职位

,在一定hands on labs的链接RxJS。

希望这也有帮助!