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); } } } });