Extjs 对dataIndex为对象的column自定义升降序

最近发现如果dataIndex为对象的column,column显示内容是对象中某些属性拼接出来的,则无法基于控件本身提供的默认升降序进行排序(我用的是extjs6)。

发现可以通过重写column的sort函数来实现自定义升降序规则,这也适用于可以使用默认排序,但是因为规则不同而想重写的情况:

sort: function () {
                var ds = this.up('grid').getStore();
                var field = this.getSortParam();
                var state = (this.sortState === null ? 'ASC' : (this.sortState === 'ASC' ? 'DESC' : 'ASC'));
                ds.sort({
                    property: field,
                    direction: state,
                    sorterFn: function (v1, v2) {
                        v1 = v1.get(field);
                        v2 = v2.get(field);
                        return (v1.attr1 + v1.attr2).localeCompare(v2.attr1 + v2.attr2);
                    }
                });
            }

因为我这是一个放在一个公共columnGrid中,所以获取store的时候要先up下。

另外,this.getSortParam()是要拿到将要排序的column,也就是dataIndex的值,详情可以看源码。

还有,因为刚开始没有进行升降序,所以第一次拿到的sortState是null,要进行判断并设置默认排序。而且下一次要给相反方向值。

之后重写store对于这个field的排序规则,指定field,方向,和自定义排序规则。因为属性值都是string,所以这里用了localeCompare。

有些思路来自于这里:参考思路

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值