本人使用版本是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控件中使用拼音进行排序的更多相关文章

  1. C#中向ListView控件中添加一行数据

    C#中向ListView控件中添加一行数据: ,先声明一个ListViewItem: ListViewItem item = new ListViewItem(); ,添加第一列数据: item.Te ...

  2. android中去掉ListView控件中的分割线

    通过设置android:divider="@null" ,可以去掉ListView控件中的分割线 也可以自定义分割线的颜色,比如: <ListView android:id= ...

  3. 关于WPF中ItemsControl系列控件中Item不能继承父级的DataContext的解决办法

    WPF中所有的集合类控件,子项都不能继承父级的DataContext,需要手动将绑定的数据源指向到父级控件才可以. <DataGridTemplateColumn Header="操作 ...

  4. C#中设置TextBox控件中仅可以输入数字且设置上限

    首先设置只可以输入数字: 首先设置TextBox控件的KeyPress事件:当用户按下的键盘的键不在数字位的话,就禁止输入 private void textBox1_KeyPress(object ...

  5. ASP.Net中的TreeView控件中对节点的上移和下移操作

    Web中的TreeView中的没有PreNode和NextNode属性. 但它的集合属性中有一个IndexOf属性,从而能够找到它的前一个节点知后一个节点. TreeView中要么只有一个根节点:要么 ...

  6. Table 控件各元素及属性

    功能:在Web页中创建通用表格里. 属性: 1.CellPadding属性:用于设置表中单元格的边框和内容之间的距离(以像素为单位).默认为-(未设置). 2.CellSpacing属性:用于设置表中 ...

  7. 灵活轻便的Table控件,适合复杂样式的内容排版

    github仓库地址 https://github.com/gaoyangclub/GYTableViewController 前言 TableView是在项目开发的时候经常用到的组件,几乎百分之八十 ...

  8. 关于使用MVVM模式在WPF的DataGrid控件中实现ComboBox编辑列

    最近在做一个组态软件的项目,有一个需求需要在建立IO设备变量的时候选择变量的类型等. 建立IO变量的界面是一个DataGrid实现的,可以一行一行的新建变量,如下如所示: 这里需要使用带有ComboB ...

  9. 利用书签功能对TDBGrid控件中多个记录的处理

    DELPHI 的TDBGrid 控 件 主 要 用 来 处 理 数 据 表, 它 的 属 性 中 有 一 个dgMultiSelect, 若 此 属 性 设 定 为TRUE, 则 可 以 选 中 多 ...

随机推荐

  1. Spring Boot的Listener机制的用法和实现原理详解

    之前在介绍了在spring-boot启动过程中调用runner的原理,今天我们介绍另外一种可以实现相似功能的机制:spring-boot的Listener机制. 通过注册Listener,可以实现对于 ...

  2. Jmeter测试demo

    复制代码,保存为.jmx文件 需要安装插件: JMeterPlugins-ExtrasLibs E:\软件\apache-jmeter-3.0\lib\ext <?xml version=&qu ...

  3. Fiddler导出Jmeter脚本

    版本:V4.4 用途:将fiddler抓取的请求,导出为jmx格式,方便jmeter直接调用 新增功能: 1.在测试计划下,新增[HTTP请求默认值],内容为空,后续需将站点的IP和端口填下在这个下面 ...

  4. 该问题是需要导包!!!需要pom中添加依赖The absolute uri: http://java.sun.com/jsp/jstl/core cannot be resolved in either web.xml or the jar files deployed with this application

    <!-- https://mvnrepository.com/artifact/org.apache.taglibs/taglibs-standard-impl --><depend ...

  5. 如果IDEA右上角的tomcat消失了,解决办法

    看了很多博客都没有找到解决办法,还是老师帮我解决的

  6. caffe入门-人脸检测1

    最近刚入门caffe,跟着视频做了一个简单人脸检测.包括人脸二分类模型+方框框出人脸. 人脸二分类模型 1. 收集数据 我用的是lfw数据集,总共有13233张人脸图片.非人脸数据有两种选择.1. 用 ...

  7. PEM routines:PEM_read_bio:no start line

    https://blog.csdn.net/xiejunna/article/details/71151006 在放置证书后,运行nodejs抛异常:PEM routines:PEM_read_bio ...

  8. mongodb实现自增的方法

    前面操作看菜鸟教程 function getNextSequenceValue(sequenceName){ var sequenceDocument = Counter.findOneAndUpda ...

  9. Flink的广播变量

    Flink支持广播变量,就是将数据广播到具体的taskmanager上,数据存储在内存中,这样可以减缓大量的shuffle操作: 比如在数据join阶段,不可避免的就是大量的shuffle操作,我们可 ...

  10. glusterfs分布式复制扩容卷以及平衡卷

    随着数据量的增长,需要扩容满足使用.今天测试下glusterfs磁盘扩容的具体步骤 1.扩容 之前用的2台计算机的分布式复制卷.需要同时之两个服务器增加一块磁盘并格式化,挂载并扩容 热添加磁盘 ech ...