Question

我有一个像这样的网格面板

Ext.define('sCon.view.SalesGrid',{
        extend: 'Ext.grid.GridPanel',
        title: 'Sales Data',

        //other params   

        initComponent: function(){
            this.callParent(arguments);
        }
    });

在点击事件中，我想更改此面板的标题。我在控制器中的代码看起来像这样。

Ext.define('sCon.controller.SalesGridController', {
        extend: 'Ext.app.Controller',
        views: ['SalesGrid'],

        // other handlers

        changeTitle: function(newTitle){
            this.getView('SalesGrid').setTitle('title_changed');
        }

目前它说它没有setTitle（）这样的功能。但是文档说网格面板有setTitle（）函数。我也尝试使用'title'变量更改标题，如

 changeTitle: function(newTitle){
            this.getView('SalesGrid').title = 'title_changed';

既不起作用也请帮忙。

Answer 1

UPD： Here是来自Sencha for ExtJS 4.1的一些refs文档。

使用控制器的refs属性来获取对任何组件的引用。

在你的例子中：

Ext.define('sCon.view.SalesGrid',{
  extend: 'Ext.grid.GridPanel',
  title: 'Sales Data',

  alias: 'widget.salesgrid',

  //other params   

  initComponent: function(){
    this.callParent(arguments);
  }
});

在Controller中添加：

refs: [
  { ref: 'salesGrid', selector: 'salesgrid', },
]

然后，您可以从控制器中的任何位置访问SalesGrid视图，例如this.getSalesGrid();方法。

在你的情况下：

changeTitle: function(newTitle){
  this.getSalesGrid().setTitle('title_changed');
}

Answer 2

注意

在所描述的案例中，webbandit回答是访问视图实例的最佳选择   留下来澄清使用自生吸气剂。

您使用的选择器方法只为您提供类，而不是它的实例！

你应该这样做

this.getView('SalesGrid').create().setTitle('title_changed');

请参阅API

extjs更改事件的面板标题

2 个答案: