如何在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, 则 可 以 选 中 多 ...
随机推荐
- laravel 兜底路由
在 Laravel 5.6 中,引入了兜底路由功能.所谓兜底路由,就是当路由文件中定义的所有路由都无法匹配用户请求的 URL 时,用来处理用户请求的路由,在此之前,Laravel 都会通过异常处理器为 ...
- ZenMap扫描笔记
1.软件界面如下,ZenMap 扫描工具是kali linu中对WEB渗透扫描的一款工具
- JavaScript实现的抛物线运动效果
css88 技术文档地址: http://www.css88.com/archives/5355 张鑫旭 技术文档地址: https://www.zhangxinxu.com 使用示例: 使用时直接引 ...
- MySQL5.7.20安装过程报错CMake Error at cmake/boost.cmake:81 (MESSAGE):
MySQL在5.7版本及以后,都需要boots 库,所以需要先安装boots 步骤: 1.在/usr/local下创建 名为boots的目录 mkdir -p /usr/local/boots 2.进 ...
- Axure之全局变量
****全局变量*****1.定义:变量是一个数据的容器,是一个字符串,可设置默认值:2.功能:两个功能:读.写3.特点:随时随地可以对变量进行读和写,不限页面.也就是在不同的页面也可以访问同一个全局 ...
- Mac下Java JDK的下载安装和配置
一.下载安装 打开一个搜索引擎,输入JDK,找到Java JDK 如图: 点击打开,同意协议开始下载如图: 下载好以后,安装即可. 安装成功以后,进入根目录,可以找到JDK安装的位置: 资源库——& ...
- linux上安装redis并使用
1.下载:curl -O http://download.redis.io/releases/redis-4.0.6.tar.gz 2.在/usr/local/redis上解压:tar -zxvf r ...
- 步步为营-104-Lambda语句
1:Lambda的拼接 首先借助一个Lambda的帮助类 using System; using System.Collections.Generic; using System.Linq; usin ...
- Nancy 返回值详解
简介 Nancy 是一个轻量级的,简单粗暴的framework用来构建基于HTTP的各种服务,兼容.Net和Mono.它的返回值也是多种多样的,适应各种不同的情况.包括Response.AsFile( ...
- dnsjava usage
linux dig 命令使用方法 https://www.imooc.com/article/26971?block_id=tuijian_wz https://jimwayne.blogspot.c ...