ExtJS4 actioncolumn动态显示图标

今天做ExtJS时有这么一个需求，在一个gridpanel中用到actioncolumn，但actioncolumn中的items不是全部显示的，而是根据store里的data动态显示，比如说账号管理，一个账号有几种状态，那么显示的图标就不一样了，而我想到的一个做法就是，在actioncolumn下的items里把所有状态的图标都定义出来，然后根据每一个record的数据的状态来显示和隐藏，但却无从下手，不知如何拿到store中的record，在看到文档中items下的每一个item都有一个getClass属性后，我眼前一亮，它是一个function，第三个参数是record，而且getClass函数可以返回一个CSS样式，原文如下：

• getClass : Function

  A function which returns the CSS class to apply to the icon image.

  Parameters

  • v : Object

    The value of the column's configured field (if any).

  • metadata : Object

    An object in which you may set the following attributes:

    • css : String

      A CSS class name to add to the cell's TD element.

    • attr : String

      An HTML attribute definition string to apply to the datacontainer element within the table cell (e.g. 'style="color:red;"').

  • r : Ext.data.Model

    The Record providing the data.

  • rowIndex : Number

    The row index..

  • colIndex : Number

    The column index.

  • store : Ext.data.Store

    The Store which is providing the data Model.

那么，就可以在这个函数里做判断了，先是用record来判断状态，如果在当前这条记录不要显示该column的话，就返回'x-hidden'，否则就什么都不返回，还有，如果不想隐藏它，而是设为禁用，则可以这样写： return this.disabledCls; 这是它自己禁用的CSS样式。

备注： 我的Ext版本是4.0.7