ExtJs 按鈕 - 在單擊偵聽器上更改文本和 cls

Question

我有一個 extjs 3.4 按鈕，它的作用類似於切換按鈕，請參閱下面的代碼：

    this.advanceFilterToggleBtn = {
    xtype: 'button',
    id: 'advancedSearchLink',
    text: 'More Filter Options',
    iconCls: 'button-more-filter-options',
    width: '150',
    listeners: {
        click: function(btn, el){
            // do stuff
            if(this.text === 'More Filter Options'){
                // do some more stuff
                this.text = 'Less Filter Options';
                this.iconCls = 'button-less-filter-options';
            }else {
                this.text = 'More Filter Options';
                this.iconCls = 'button-more-filter-options';
            }
        }
    }

按鈕上的文本和類發生了變化，我可以確認，但顯示未更新。 這意味着它仍然顯示相同的初始文本和向下的 V 形。 我在 chrome 開發工具中有斷點，if 和 else 塊都被擊中。

我嘗試使用通過單擊偵聽器傳遞的 btn 對象的 setText 和 setIconCls 而不是使用“this”，但它不起作用。 在這種情況下，else 塊不會被擊中。

我嘗試在 if 和 else 塊的開頭移動 this.text 和 this.iconCls 但沒有運氣。

任何幫助表示贊賞。

謝謝

Answer 1

if(btn.getText() === 'More Filter Options'){
    advForm.expand(true);
    filterPanel.setHeight(220);
    srTab.doLayout();
    btn.setText('Less Filter Options');
    btn.setIconCls('button-less-filter-options');
} else {
    advForm.collapse();
    filterPanel.setHeight(130);
    srTab.doLayout();
    btn.setText('More Filter Options');
    btn.setIconCls('button-more-filter-options');
}