extjs xtype按鈕樣式變量

Question

我想將變量（btnWidth / bthHeight）設置為按鈕的width（height）：

Ext.define(
  'TestPanel', {
    extend: 'Ext.Panel',
    width: 300,
    height: 35,
    btnHeight: 25,
    btnWidth: 25,
    items: [{
      xtype: 'button',
      width: btnWidth,
      height: btnHeight,
    }, {
      xtype: 'button',
      width: btnWidth,
      height: btnHeight,
    }  
  }

這是錯誤消息：

Uncaught TypeError: Cannot read property 'btnWidth' of undefined

題

我該如何解決？

Answer 1

為此，您需要為panel使用initComponent方法。 在panel您將定義自定義配置，並且可以進入initComponent方法。

在此FIDDLE中 ，我使用panel ， button和initComponent方法創建了一個演示。 希望這對您有所幫助或指導您達到要求。

代碼段

Ext.define('TestPanel', {
    extend: 'Ext.panel.Panel',
    bodyPadding: 5,
    width: 300,
    btnHeight: 38,
    btnWidth: 50,
    title: 'Buttons example',
    initComponent: function (config) {
        var me = this,
            btnWidth = me.btnWidth,
            btnHeight = me.btnHeight;

        me.items = [{
            xtype: 'button',
            text: 'Button 1',
            width: btnWidth,
            height: btnHeight,
            margin: 10
        }, {
            xtype: 'button',
            text: 'Button 1',
            width: btnWidth,
            height: btnHeight
        }];
        me.callParent(arguments);
    },
    renderTo: Ext.getBody()
});

//Create component
Ext.create('TestPanel');