需要 ExtJs 边框布局项目选择帮助。答案

【问题标题】：ExtJs border layout item selection help needed.需要 ExtJs 边框布局项目选择帮助。
【发布时间】：2013-06-25 20:36:19
【问题描述】：

我正在尝试使用 Ext JS 开发应用程序。到目前为止，我已经开发了一个带有边界布局的视口，并且我已经完成了北部区域和南部区域。在中心区域，我有多个面板，例如 1. 用于搜索数据。 2.输入数据任务列表（表单），在下一个面板上我也想显示网格并具有项目双击的动态行为。我成功地将所有东西放在一起。

另一方面，我已经定义了在网格上双击项目的控制器。例如：

this.control({
    'viewport>userlist': {
        itemdblclick: this. editUser,
    },
.......

因此，如果我将用户列表与其他两个面板一起放在中心区域的视口中，则选择不起作用。需要建议。

以下是我的代码：

launch : function() {
    Ext.create('Ext.container.Viewport', {
        layout : 'border',
        autoScroll : true,
        items : [{
            region: 'north',
            .......
        },{
            region: 'west',
            ..............
        },{
            region: 'center',
            items:[{
                xtype: 'panel',
                ..............
            },{
                xtype: 'panel',
                ............
            },{
                xtype: 'userlist'//this is what i like to have and my controller should respond the item click. 
            }]
        }]

卡住了！！！！帮助将不胜感激！！！

【问题讨论】：

标签： javascript extjs

【解决方案1】：

您的引用似乎定义不正确。由于userlist 嵌入在panel（您的中心区域）中，除非您（1）包含包含面板或（2）删除>，否则使用viewport > userlist 将不起作用：

this.control({
    'viewport > panel > userlist': {
        itemdblclick: this.editUser,
    },
.......

或：

this.control({
    'viewport userlist': {
        itemdblclick: this.editUser,
    },
.......

这是因为Ext.ComponentQuery 中的> 仅查找组件树中的直接子级。有关文档，请参见此处：http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.ComponentQuery

【讨论】：