今天做ExtJS时有这么一个需求,在一个gridpanel中用到actioncolumn,但actioncolumn中的items不是全部显示的,而是根据store里的data动态显示,比如说账号管理,一个账号有几种状态,那么显示的图标就不一样了,而我想到的一个做法就是,在actioncolumn下的items里把所有状态的图标都定义出来,然后根据每一个record的数据的状态来显示和隐藏,但却无从下手,不知如何拿到store中的record,在看到文档中items下的每一个item都有一个getClass属性后,我眼前一亮,它是一个function,第三个参数是record,而且getClass函数可以返回一个CSS样式,原文如下:
A function which returns the CSS class to apply to the icon image.
The value of the column's configured field (if any).
An object in which you may set the following attributes:
A CSS class name to add to the cell's TD element.
An HTML attribute definition string to apply to the datacontainer element within the table cell (e.g. 'style="color:red;"').
The Record providing the data.
The row index..
The column index.
The Store which is providing the data Model.
那么,就可以在这个函数里做判断了,先是用record来判断状态,如果在当前这条记录不要显示该column的话,就返回'x-hidden',否则就什么都不返回,还有,如果不想隐藏它,而是设为禁用,则可以这样写: return this.disabledCls; 这是它自己禁用的CSS样式。
备注: 我的Ext版本是4.0.7