如何在Extjs Grid中始终显示箭头图标？

Ext.create('Ext.grid.Panel', {
    store: store,
    columns: [{
        text: 'Name',
        dataIndex: 'name',
        flex: 1
    }, {
        text: 'Age',
        dataIndex: 'age',
        flex: 1
    }, {
        text: 'Gender',
        dataIndex: 'gender',
        flex: 1,
        renderer: function(value, metaData, record) {
            // 根据value的值来确定箭头图标的显示
            if (value === 'Male') {
                metaData.tdCls = 'arrow-up-icon'; // 自定义CSS类名，用于显示箭头图标
            } else if (value === 'Female') {
                metaData.tdCls = 'arrow-down-icon'; // 自定义CSS类名，用于显示箭头图标
            }
            return value;
        }
    }],
    renderTo: Ext.getBody()
});