的Ext JS 4：自定義基於條件

我試圖創建自定義屬性值對象的屬性值（基於函數的條件）對我的分機的對象，而不是僅指定一個值。的Ext JS 4：自定義基於條件

實施例1：

舊代碼（工作）

 this.buttons = [ 
      { 
       text: 'Save',

enter image description here

新代碼（不工作）

 this.buttons = [ 
      { 
       text: function() { 
        return 'Save X'; 
       },

enter image description here

實施例2：

舊代碼（工作）

    }, { 
         width: 270, 
         labelAlign: 'right', 
         xtype: 'textfield', 
         name: 'user_id', 
         fieldLabel: 'User ID', 
         hidden: true 
        }]

新代碼（不工作）

    }, { 
         width: 270, 
         labelAlign: 'right', 
         xtype: 'textfield', 
         name: 'user_id', 
         fieldLabel: 'User ID', 
         hidden: function() { return true; } 
        }]

例3：

忽略整個文本框對象（例如懶惰）完全基於一個條件：

    }, { 
         width: 270, 
         labelAlign: 'right', 
         xtype: 'textfield', 
         name: 'employee_number', 
         fieldLabel: 'Employee Number' 
        }]

來源

2012-08-31 MacGyver

你根本無法做到這樣。用函數替換類型是不可能的。在你的情況下，你將一個函數引用分配給一個預期爲布爾值的變量，對於該字符串也是一樣的。

解決方案A.

，您應考慮自己寫一個場廠。在該工廠中，您可以在分配配置之前執行任何功能。（排序相同，則B，而可以被用於減少函數調用的）

溶液B.

使用函數引用本身。然後這個應該被執行。（不需要類延伸並且可以重複使用）

// The data store containing the list of states 
var states = Ext.create('Ext.data.Store', { 
    fields: ['abbr', 'name'], 
    data : [ 
     {"abbr":"AL", "name":"Alabama"}, 
     {"abbr":"AK", "name":"Alaska"}, 
     {"abbr":"AZ", "name":"Arizona"} 
     //... 
    ] 
}); 
Ext.namespace('my.util.helper'); 
my.util.helper.decideHide = function() { return true; } 

// Create the combo box, attached to the states data store 
Ext.create('Ext.container.Container', { 
    renderTo: Ext.getBody(), 
    items: [{ 
     xtype: 'combo', 
     fieldLabel: 'Choose State', 
     store: states, 
     queryMode: 'local', 
     displayField: 'name', 
     valueField: 'abbr', 
     test: my.util.helper.decideHide(), 
     listeners: { 
      afterrender: function(n) { 
       alert(n.test); 
      } 
     } 
    }] 
});

解決方案C.

如果else語句

// ... // more code 
{ 
    text: myCondition ? 'Text A' : 'Text B', 
    // more code 
} 
// ... // more code

來源

2012-08-31 18:00:38 sra

解決方案A是矯枉過正imo。解決方案B目前不會按照其編碼工作。 'decideHide'是一個永遠不會執行的函數。解決方案C不使用功能。 – pllee

我必須承認，如果解決方案B希望在沒有全球範圍的情況下以這種方式工作，那麼您完全正確 – sra

談論解決方案C：如果可能的話，應該避免任何不需要的函數調用。這是循環內最重要的，但如果我只檢查一個條件，則不需要爲此調用函數。應用程序越大，這些小東西就越有助於保持性能。 – sra

是啊，這是行不通的我在這種情況下，大多數使用該解決方案被簡化，一些分機CONFIGS採取將被評估的功能，但大部分別噸。而不是創建匿名函數，而不是調用它們，我會做這樣的事情：

Ext.define('UserPanel', { 
    extend : 'Ext.panel.Panel', 
    initComponent : function() { 

     this.items = [{ 
      xtype : 'button', 
      text : this._getSaveButtonText() 
     }, { 
      width : 270, 
      labelAlign : 'right', 
      xtype : 'textfield', 
      name : 'user_id', 
      fieldLabel : 'User ID', 
      hidden : this._isUserIdHidden() 
     }] 
     this.callParent(); 
    }, 

    _getSaveButtonText : function() { 
     return 'Save'; 
    }, 

    _isUserIdHidden : function() { 
     return true; 
    } 
});

來源

2012-09-01 20:32:44 pllee

的Ext JS 4：自定義基於條件

回答

相關問題