是否在UI呈现最佳实践后发布/订阅事件而不管框架?

Geo*_*pty 6 javascript events user-interface extjs publish-subscribe

我继承了一个相当大的Javascript/ExtJS3代码库,在调用"... superclass.initComponent.apply(this,arguments)"之后,有许多在重写的initComponent方法内部调用事件的实例.正在以下列方式调用特定对象的特定事件:

this.filter.on('filterUpdated', function(filter, params)
Run Code Online (Sandbox Code Playgroud)

我已经开始转换代码以使用pub/sub范例,以减少对象与其特定事件名称之间的耦合,但在发布和/或订阅initComponent中的事件时很快遇到问题(ExtJS在渲染之前执行).我需要在屏幕第一次加载时从最高级别的组件触发"INIT"事件,并且我要么得到一个错误(由于ExtJS"模板"没有被渲染,因为它结束了),或者根本没有触发的事件.

然后我在Ext.Component的ExtJS源代码中阅读以下内容(所有组件都从中扩展)并且我有一个"aha"时刻:

    if (this.tpl) {
        if (!this.tpl.compile) {
            this.tpl = new Ext.XTemplate(this.tpl);
        }
        if (this.data) {
            this.tpl[this.tplWriteMode](contentTarget, this.data);
            delete this.data;
        }
    }
    this.afterRender(this.container);
Run Code Online (Sandbox Code Playgroud)

当我切换到从我最顶层的组件的afterRender方法发布"INIT"事件,并从他们的afterRender方法订阅所有其他组件的所有事件时,一切都按预期工作.而现在我只是想知道,主要是为了验证我的设计....

这是在事件驱动的UI中实现pub/sub的普遍接受的方式吗?无论框架甚至?即以下2个好的原则,还是他们的其他方式?

  1. 应在所有子组件渲染后发布"初始化事件"
  2. 所有子组件在渲染后都应该订阅所有事件(安全方面)

提前致谢

sea*_*and 0

您必须平衡事件处理的开销与丢失重要事件的可能性。在 js/DOM 中,土地状态是可变的。

对于#1,如果您可以确定所有子组件都已渲染并订阅的时间点,则触发 init 事件是有意义的。

对于#2,每个人监听事件似乎都是安全的;然而,这可能会减慢速度。如果性能问题很明显,您可能必须决定不关心哪些事件并避免订阅。