使用 ComponentQuery - Extjs 显示隐藏面板答案

【问题标题】：Displaing a hidden panel using ComponentQuery - Ext JS使用 ComponentQuery - Extjs 显示隐藏面板
【发布时间】：2013-08-10 05:51:33
【问题描述】：

我只想在单击按钮时显示一个隐藏的面板。

目前我有这个代码：

search: function(btn) }
   btn.up('panel').nextSibling().show();
   ...

它定位父面板并显示（）该面板的下一个兄弟。（我想我解释得对……？）

但是，我觉得使用 ComponentQuery 来调用我想要显示的面板会更有效，因为我的应用程序的布局可能会在未来发生变化，这会改变我的组件的层次结构及其职能。

这是我要显示的hidden 列表视图（面板）：

Ext.define('AM.view.metadata.List' ,{
    extend: 'Ext.grid.Panel',
    alias: 'widget.metadatalist',
    title: '<center>Results</center>',
    store: 'Metadata', 
    ...

有什么想法吗？

【问题讨论】：

标签： button extjs panel component-query

【解决方案1】：

你可以给你的面板一个 itemId

Ext.define('AM.view.metadata.List' ,{
    extend: 'Ext.grid.Panel',
    alias: 'widget.metadatalist',
    title: '<center>Results</center>',
    store: 'Metadata', 
    itemId: 'targetPanel'

并使用这个 ComponentQuery

search: function(btn) 
    Ext.ComponentQuery.query('#targetPanel');
    ...

【讨论】：