ExtJS的4.2.1的GridPanel - 在模板列顯示/隱藏鏈接

Question

我有包含URL我的GridPanel模板列：

{ 
     xtype: 'templatecolumn', 
     tpl: Ext.create('Ext.XTemplate', 
      '<a href="#" class="x-leave-request-edit">Edit</a>' 
     ) 
    } 

當通過在GridPanel中特定行用戶移動鼠標，我想要的鏈接可見：

listeners: { 
     'itemmouseenter' : function(gridpanel, record, item) { 
      var editLink = Ext.select(Ext.query('a.x-leave-request-edit', item, 'select', true)); 
      editLink.setVisible(true); 
     }, 
     'itemmouseleave' : function(gridpanel, record, item) { 
      var editLink = Ext.select(Ext.query('a.x-leave-request-edit', item, 'select', true)); 
      editLink.setVisible(false); 
     } 
    } 

這工作正常。但問題是，默認情況下，我希望tpl中的鏈接不可見。我怎樣才能做到這一點？我嘗試在onRender（），afterRender（）和finishRender（）中使用類似的代碼，但Ext.query（）總是返回一個空數組。

Answer 1

而是所有query醜陋的，你可以用：

item.down('.x-leave-request-edit')。

爲了使它在開始時不可見，只需在內聯樣式中添加display: none;即可。

return '<a href="#" style="display: none;" class="x-leave-request-edit">Edit</a>';