如何在ElementUI中的Table控件中使用拼音进行排序
本人使用版本是1.4.7
在这个版本中对应全是String的column进行排序并不是按照拼音的方式排列的。
这里我贴一下源代码就可以看出是为什么了:
export const orderBy = function(array, sortKey, reverse, sortMethod) {
if (typeof reverse === 'string') {
reverse = reverse === 'descending' ? -1 : 1;
}
if (!sortKey && !sortMethod) {
return array;
}
const order = (reverse && reverse < 0) ? -1 : 1; // sort on a copy to avoid mutating original array
return array.slice().sort(sortMethod ? function(a, b) {
return sortMethod(a, b) ? order : -order;
} : function(a, b) {
if (sortKey !== '$key') {
if (isObject(a) && '$value' in a) a = a.$value;
if (isObject(b) && '$value' in b) b = b.$value;
}
a = isObject(a) ? getValueByPath(a, sortKey) : a;
b = isObject(b) ? getValueByPath(b, sortKey) : b;
return a === b ? 0 : a > b ? order : -order;
});
};
关键就在:
return a === b ? 0 : a > b ? order : -order; return sortMethod(a, b) ? order : -order;
本人之前直接用
a.brandName.localeCompare(b.brandName)
导致排序出问题,因为源代码中只接受true与false,而且localeCompare会返回1、0、-1,-1会被转化为true,从而造成了bug。正确方式:
return a.brandName.localeCompare(b.brandName)>0 ? 1:0;
将-1转化为0,这样就正确了
ps.需要判断a与b是否为空,如果为null就赋值为‘’
2017/12/14升级了2.08发现源代码的判断方式改掉了,所以需要改成:
return a.brandName.localeCompare(b.brandName)>0;
如何在ElementUI中的Table控件中使用拼音进行排序的更多相关文章
- C#中向ListView控件中添加一行数据
C#中向ListView控件中添加一行数据: ,先声明一个ListViewItem: ListViewItem item = new ListViewItem(); ,添加第一列数据: item.Te ...
- android中去掉ListView控件中的分割线
通过设置android:divider="@null" ,可以去掉ListView控件中的分割线 也可以自定义分割线的颜色,比如: <ListView android:id= ...
- 关于WPF中ItemsControl系列控件中Item不能继承父级的DataContext的解决办法
WPF中所有的集合类控件,子项都不能继承父级的DataContext,需要手动将绑定的数据源指向到父级控件才可以. <DataGridTemplateColumn Header="操作 ...
- C#中设置TextBox控件中仅可以输入数字且设置上限
首先设置只可以输入数字: 首先设置TextBox控件的KeyPress事件:当用户按下的键盘的键不在数字位的话,就禁止输入 private void textBox1_KeyPress(object ...
- ASP.Net中的TreeView控件中对节点的上移和下移操作
Web中的TreeView中的没有PreNode和NextNode属性. 但它的集合属性中有一个IndexOf属性,从而能够找到它的前一个节点知后一个节点. TreeView中要么只有一个根节点:要么 ...
- Table 控件各元素及属性
功能:在Web页中创建通用表格里. 属性: 1.CellPadding属性:用于设置表中单元格的边框和内容之间的距离(以像素为单位).默认为-(未设置). 2.CellSpacing属性:用于设置表中 ...
- 灵活轻便的Table控件,适合复杂样式的内容排版
github仓库地址 https://github.com/gaoyangclub/GYTableViewController 前言 TableView是在项目开发的时候经常用到的组件,几乎百分之八十 ...
- 关于使用MVVM模式在WPF的DataGrid控件中实现ComboBox编辑列
最近在做一个组态软件的项目,有一个需求需要在建立IO设备变量的时候选择变量的类型等. 建立IO变量的界面是一个DataGrid实现的,可以一行一行的新建变量,如下如所示: 这里需要使用带有ComboB ...
- 利用书签功能对TDBGrid控件中多个记录的处理
DELPHI 的TDBGrid 控 件 主 要 用 来 处 理 数 据 表, 它 的 属 性 中 有 一 个dgMultiSelect, 若 此 属 性 设 定 为TRUE, 则 可 以 选 中 多 ...
随机推荐
- ATM机模拟系统
实验要求 https://pan.baidu.com/s/1Sq5joWyVsNhY8DYiyI4UmQ 源代码 /*信1705-1 20173458 王嘉梁*/ package atm; impor ...
- log4j2的log输出到tomcat/logs目录下及使用(转)
原文链接:http://blog.csdn.net/honghailiang888/article/details/50370252 原文作者: Herman-Hong 一.环境配置 log4j2. ...
- spring cloud Hystrix监控面板Hystrix Dashboard和Turbine
我们提到断路器是根据一段时间窗内的请求情况来判断并操作断路器的打开和关闭状态的.而这些请求情况的指标信息都是HystrixCommand和HystrixObservableCommand实例在执行过程 ...
- docker文件复制到centos/linux/ubantun环境下
1.有些时候我们需要将容器里面的文件,弄到系统里面来分析,像报错log等 格式:docker cp 容器名:文件在容器里面的路径 要拷贝到宿主机的对应路径 2.有些情况下,我们需要将文 ...
- Oracle查询CLOB字段类型的内容
select dbms_lob.substr(lo.ldtext) as text from longdescription lo
- ReactNative——页面跳转
效果图: 进入工作目录,运行 react-native init NavigatorProject 创建项目NavigatorProject import React, { Component } f ...
- 无法连接ssh,fatal: daemon() failed: No such device
今天发现一个服务器的sshd无法启动,查看/var/log/secure里发现:fatal: daemon() failed: No such device 解决办法: rm /dev/null /d ...
- 【BZOJ4998】星球联盟
题解: 应该还是比较水的 首先很容易发现的就是两个点一旦联通他们就永远联通了 所以联通之后我们就把他们之间缩成一个点
- C# 之 提高WebService性能大数据量网络传输处理
1.直接返回DataSet对象 特点:通常组件化的处理机制,不加任何修饰及处理: 优点:代码精减.易于处理,小数据量处理较快: 缺点:大数据量的传递处理慢,消耗网络资源: 建议:当应用系统在内网.专网 ...
- Flink--Split和select
Split就是将一个DataStream分成两个或者多个DataStream Select就是获取分流后对应的数据 val env = StreamExecutionEnvironment.getEx ...