extjs - Extjs 4 - 应用程序上下文帮助 - 查找重点组件

Question

我正在考虑在我的应用程序中实现上下文帮助，我想知道是否可以按照我的想法实现它：

1. 注册 Ext.Body() ex 的全局快捷方式。ctrl+h
2. 快捷方式处理程序将找到焦点组件并调用其 showHelp 方法
3. 如果组件没有 showHelp 方法，它将移动到其父级并调用 showHelp 方法。

我想知道第2步是否可行？还是有更好的方法来做到这一点？

Answer 1

好的，我深入研究它。首先，我执行以下操作来实现上下文帮助：

1. 创建帮助插件并将其添加到应提供上下文帮助的每个组件中。插件将点击监听器注册到每个组件。
2. 触发的 click 事件将其源注册到静态 HelpManager 中，该 HelpManager 包含对最后一个焦点组件的引用
3. 然后按下快捷方式后，我从 HelpManager 获取最后一个组件并使用其帮助配置触发上下文帮助。

代码：

    Ext.define('GSIP.core.help.GSIPHelp',{
        别名：'plugin.help',
        初始化：函数（组件）{
            //var me = this;
            component.on('afterrender',function(c) {
                //为什么焦点事件不起作用？只有点击。
                c.getEl().on('点击',function() {
                    console.log('应该注册焦点');
                    GSIP.core.help.GSIPHelpMgr.registerFocus（组件）；
                });
            });
        }
    });

该解决方案存在严重缺陷。如果组件有父组件并且它们都获得了帮助插件，则单击事件将触发两次，父组件作为最后一个。

在编码期间，我在文档中找到了Ext.FocusManager，就是这样！使用它我能够找到重点组件。使用简单的功能：如果组件没有帮助，我会扫描其父级以找到一个，如果没有父级，我只显示索引，我能够创建上下文帮助。

    Ext.define('GSIP.core.help.Help',{
        混合：{
            文档：'GSIP.core.utils.Document'
        },
        url:'/GSIP/resources/gsip/core/help/html/',
        显示帮助：函数（comp）{

            if (comp.help != undefined) {
                this.showDocumentSrc(this.url + comp.help + '.html');
            }别的{
                如果（comp.ownerCt == 未定义）{
                    this.showDocumentSrc(this.url + 'index.html');
                }别的{
                    this.showHelp(comp.ownerCt);
                }
            }
        }
    });